부트캠프 사전스터디 커리큘럼을 정리한 내용입니다.
Frontend 개발자로 부트캠프를 참여했지만 이번 커리큘럼을 통해 Backend에 대한 이해도도 높아져서 좋았습니다.
🚀 What I Will Learn
- Frontend vs. Backend vs. Fullstack 의 차이점에 대해 이해한다.
- Frontend 개발자가 하는 일을 설명할 수 있다.
- Backend 개발자가 하는 일을 설명할 수 있다.
- 나는 어떤 개발자가 되고 싶은지에 대해 고민한다.
1. ✍🏻 Frontend vs. Backend vs. Fullstack 의 차이점에 대해 이해한다.
WEB란 데스크탑에서 브라우저로 접속하는 각종 서비스들을 말한다.
WEB개발은 웹프론트엔드 개발자랑 서버를 다루는 백엔드 개발자가 있다.
사용되는 모든 데이터와 정보들이 보관된 하나의 서버(백엔드)에서 데이터를 넘겨준다.
| 분야 | 사용언어 |
|---|---|
| 프론트엔드 | HTML, CSS, JavaScript |
| 백엔드 | JavaScript, python, Java, PHP 등 (상황에 따라 사용하는 언어가 다름) |
| 데이터베이스 | SQL |
2. ✍🏻 Frontend 개발자가 하는 일을 설명할 수 있다.
🙌🏻오해부터 풀고가자!
예술적인 감각이 부족해서 프론트엔드가 안맞는다는건 오해이다. 디자이너 분들이 계시니 걱정하지말자!
프론트엔드가 하는 일
- UI개발, event에 대한 로직 개발
- 크로스 브라우징/디바이스 : 여러 종류의 브라우저와 디바이스가 있는데 프론트엔드는 모든 브라우저와 모든 디바이스에서 잘 나올 수 있도록 해야된다.
- 데이터 시각화 : 백엔드에서 가져온 데이터를 사용자가 어떻게 잘 보이게 할 수 있을지 고민하고 시각화 하는 것
프론트엔드의 필요자질
- 수학적인 지식, 데이터 구조에 대해 잘 알아야한다.
- 브라우저에 대한 이해도도 중요하다.
- 사용자 이벤트에 대한 로직과 알고리즘에 대해서 잘 알고 있어야한다.
- JavaScript 매우 중요하다.
3. ✍🏻 Backend 개발자가 하는 일을 설명할 수 있다.
🙌🏻오해부터 풀고가자!
"백엔드가 더 개발자 같아", "나는 이과 출신이니까 백엔드야!"는 No! 프론트엔드 백엔드 모두 로직(논리적 흐름)에 대한 이해가 중요하기 때문에 어떤 성향인지에 따라 선택하는 것이 중요하다.
백엔드가 하는 일
- API구축 : 데이터를 주고받는 방법, 프론트엔드가 백엔드한테 데이터를 요청하면 백엔드가 응답해주는 api를 만든다. url로 구성,
- Data Pipeline구축 : ETL(Extract, Transform, Load), 원하는 데이터를 가져오고, 원하는 정보를 특정단위로 가져오고, 정리된 데이터를 계속 쌓는 것, 보통 백엔드가 하지만 데이터를 중요하게 다루는 회사에서는 데이터 파이프라인만 다루는 데이터 엔지니어가 있다. 데이터 엔지니어는 백엔드 지식이 기본으로 있어야한다.
- Infrastructure&Architecture구성 : 동시접속자가 많을 수록 데이터 사용공간이 더 많이 필요한데 데이터 공간이 많을수록 비용이 커지기 때문에 처음부터 크게 시작하면 안된다. 어떻게 데이터 공간을 구성하면 좋을지 생각, 보안적인 부분도 잘 생각해서 구성해야된다.
4. ✍🏻나는 어떤 개발자가 되고 싶은지에 대해 고민한다.
업무 프로세스 : 기획자 - 백엔드 - 프론트엔드 - 디자이너 - 기획자
어떤 분야를 선택하든 협업이 굉장히 중요하고, 소통이 중요하다. 따라서 프론트엔드와 백엔드를 선택할때는 무조건 성향이 중요하다. 둘중에 좀 더 흥미있는 것으로 선택하자.
선택에 도움 되는 tip
프론트엔드
- 창업, 아이디어, 나만의 것에 관심이 간다.
- 사용자 관점에서 생각한다.
- UI가 완벽하고 아름다운 사이트에 관심이 간다.
백엔드
- 서비스 구성하는 것에 관심이 간다.
- 데이터 중심의 사고가 좋다.
- 효율적이고 안정적인 시스템을 만드는 것에 관심이 간다. (억대의 사용자가 들어와도 절대 멈추지않는 사이트, 보안을 잘 생각하는 사이트에 대한 고민을 해야한다.)
추가 정리👇🏻
Front-end VS Back-end 추가 정리
프론트엔드
- 클라이언트측 개발, 웹사이트에서 보게 되는 부분에 대한 것이다.
- 버튼, 글꼴, 로고, 그 외 웹페이지에서 상호작용하는 많은 부분들이 해당한다.
예를 들어 스크롤을 내릴 때 어떤 이미지가 나오면 좋을지에 관한 것들이다.
백엔드
- 서버측 개발, 화면 뒤에서 일어나고 있는 것들이다.
- 웹페이지가 만약 기기에 관련된 페이지라면 해당 기기에 관련된 정보들은 어딘가에 저장되어 있어야한다. 이 정보들은 서버에 저장되어 있으며, 이 서버가 백엔드 개발이 이루어지는 곳이다.
- 서버에서 API 실행과 라이브러리 생성 등이 이루어지고, 데이터나 알고리즘으로 인해 프론트엔드에서 모든 것들이 잘 구현되도록 하는것이다. 마치 자동차 엔진과 같은 역활이다.
🍕🍔음식점을 예로 들면
| 프론트 엔드 | 백엔드 |
|---|---|
| 식사하는 공간 - 메뉴 웨이터 의자 음식 등 직접 보고, 만지고, 경험하는 것들에 해당 | 주방 계산대 유지보수 하는 사람들 - 테이블에서 식사하면서 잘 인지하지 못하는 부분들에 해당, 우리가 즐겁게 식사를 하기 위해서는 인지하는 못하는 이 모든 일들도 반드시 필요하다. |
따라서 프론트엔드 백엔드는 동일하게 중요하다!
이 두가지를 함께 처리하는 일이 바로 풀스택 개발이다.
강의를 통해 느낀점
프론트엔드를 하겠다고 결정한 이후에 백엔드에 대해서는 자세하게 알아보지 않아서 데이터를 다루는 일 정도로 이해하고 있었는데, 강의를 통해 좀 더 구체적으로 알 수 있었다. 강의를 마치고 나서도 나의 성향은 역시 프론트엔드구나 느꼈지만, 백엔드를 하시는 분들이 얼마나 중요한 영역을 다루는지를 좀 더 확실하게 알게돼었다. 분야에 대한 이해도가 올라갔고 덕분에 막연했던 소통과 협업이 중요성이 분명해졌다.
