[디벨로퍼] 채용 사이트 프로젝트 4

 

오늘의 작업

1. 오른쪽 뷰 쪽에 정보 아이콘 누르면 나오는 다이얼로그 추가

2. 채용 공고 페이지 반응형 UI 작업(하단 채용공고 리스트, 우측 뷰와 중간뷰, 하단 버튼 처리)

3. 사진 영역에서 크기가 커지지 않는 이슈 수정(width를 안 주고 min-width를 줬다)

4. 오른쪽 뷰 스티키 처리(탈부착 느낌)

 

솔직히 내 입장에서 모작이라고 해봐야 '별의 커비' '테라리아' 같은 게임이나 '메타마스크 UI' 따라해본 경험밖에 없다. 근데 실제로 잘 동작하는 웹페이지를 Front단으로 구현하려고 하니 은근히 빡세더라. 특히 반응형쪽은 UI자체가 생소한 편이라 신기한 느낌이다. 기본적인 반응형UI 컨셉은 앱 개발쪽도 비슷한 것 같다(뷰 띄워놓고 특정 조건에 맞춰서 보이거나 가리기) 다만 웹 개발쪽이 더욱 민감하게 반응해야 한다는 정도? 앱에서는 휴대폰/테블릿 정도로만 나눠서 처리하는 것 같다(이것도 안 하는 경우가 많다 사실) 

 

프론트엔드 개발은 확실히 앱 개발하고는 느낌이 다르다. 근데 기본적으로 뷰 만들고 API연동하고 하는 작업들은 비슷한 것 같기도... 앱 개발과 프론트엔드 개발의 큰 차이점 중에 하나는 사용할 수 있는 기술의 다양성에 큰 차이가 있다. 앱 개발에서 특정 프레임워크를 하나 잡으면, UI를 개발하는 방식이 큰 차이가 없다고 해야 할까? 안드로이드 네이티브 개발 기준으로 XML or 컴포즈 스타일 정도가 있는데, 프론트엔드를 보면 사용하는 라이브러리에 따라 UI를 먹이는 방식이 너무 다양하다. (tailwindcss, sass, styled-components ... UI컴포넌트 라이브러리까지 하면... 너무 많음;;)

 

처음 FE개발을 할 때 JS와 리액트만 써서 개발을 했는데, 이번에는 NextJS + Typescript를 사용하고 있다. 생각보다 큰 차이는 없더라. 그리고 FE쪽 코드를 프론트엔드 개발자스럽게 못 짜서 아쉽다는 생각을 많이 했는데, 내가 짜는 방식도 프론트엔드 개발에 들어가니 그만 자격지심을 느껴야겠다(기존에는 TS, 리액트 쿼리 같은 걸 안 쓴다고 내가 FE개발을 못한다고 생각했음)

 

ChakraUI를 기반으로 UI를 작성하고 디테일한 처리가 필요할 땐, TailwindCSS를 사용한다 - 충분히 FE스러운 기술스택으로 코드를 작성하고 있다. FE개발도 괜찮게 하고 있는 것이다. 사용하는 라이브러리에 맞춰서 코드 스타일은 달라진다. FE 분야 자체가 워낙 다양한 라이브러리가 많아서 이게 당연한 것이다. 

 

계속 작업해보자 ㄱㄱ