2024.3.19
21일 부터 시작하는 정식 교육 전에 간단한 사전강의가 있었다. 가볍게 개발자는 어떤 직종인지 무슨 일을 할 수 있는지에 대한 예시와 설명을 듣고, 과거의 웹사이트에서 현재의 웹사이트로 발전하기까지 어떠한 변화가 있었는지 살펴보았다. 그 후에 앞으로 부트캠프를 수료하면서 살아남고, 개발자로서 발전하려면 어떠한 태도가 동반되어야 하는지에 대한 강사님의 조언이 있었다.
1. 개발자란?
- 개발자는 많은 종류가 있다. 게임개발자, ai개발자, 블록체인개발자 등등.. 그 중에서 앞으로 내가 공부할 웹 개발자는 '웹 브라우저에서 동작하는 소프트웨어를 만드는 사람' 이라고 정리 할 수 있다.
- 예시로 설명하면, chatGPT라는 소프트웨어는 ai개발자가 만든다. 그렇지만 그것을 우리가 사용 할 수 있는 환경은 웹페이지가 제공한다. chatGPT를 사용하려면 웹브라우저에 접속 해야한다. 이 때 사용되는 웹 브라우저로는 크롬, 사파리, 웨일, 엣지 등등이 있을 수 있다.
2. 웹페이지의 진화
- 구글에 세계 최초의 웹 사이트라고 검색하면 아래의 결과가 나온다.


접속해보면 위와 같은 사이트가 뜬다. 이것이 최초의 웹사이트의 모습이다. 링크를 타고 들어가면 해당 단어에 대한 정보가 나타나게되는, 정보 제공의 역할에 충실한 모습이다. 이것만으로도 인터넷 발전 이전의 정보수집에 비하면 혁명적인 진화이다!
- 최초의 웹사이트와 같이 정보제공에 충실하면서 최근에 우리가 많이 접할 수 있는 사이트로 나무위키가 있다.

해당 페이지 역시 링크를 타고 들어가서 내가 원하는 정보에 대한 탐색을 이어나갈 수 있는 방식으로 제작되어있다.
- 그런데 링크를 타고 들어갈 때 두 사이트 간에 차이가있다. 최초의 웹사이트는 링크를 타고 들어갈 때 마다 새로고침되는 것처럼 사이트의 모든 부분이 새롭게 구성된다. 그러나 나무위키의 경우에는 큰 틀은 유지되면서 그 안에서 필요한 정보(텍스트나 이미지)만 수정되는 것을 볼 수 있다. 이것이 SPA single page application이다! 두둥
- 베이직한 자바스크립트로도 이것을 구현 할 수 있지만, 번거롭고 어려운 과정이 들어가기 때문에 SPA에 특화된 js의 라이브러리가 REACT이다. 최근의 웹사이트는 모두 SPA로 만들어지기 때문에 프론트엔드 개발자를 목표로 하는 사람에게 REACT는 필수 기술이 되었다.
3. 프론트엔드 개발자로서 필요한 기술
- REACT : 최근의 웹사이트는 거의 SPA로 만들어지기 때문에 프론트엔드 개발자를 목표로 하는 사람에게 필수 기술이 되었다. 그렇다고 HTML, CSS, Js의 선수지식을 제대로 쌓지 못해서는 안된다. 리액트는 결국 앞선 기술들을 정리한 라이브러리이기 때문이다.
- ts, next.js, node.js 등은 REACT의 약점을 보완하는 라이브러리이다.
리액트의 경우에는 SEO(검색 엔진 최적화, 웹사이트가 검색 결과에 더 잘 보이도록 최적화하는 과정)에 약한데 이것을 next.js로 보완할 수 있다.
( https://velog.io/@zinukk/d-v8gyfq4x 위 내용에 대한 정보를 해당 블로그에서 좀 더 공부해보았다. 간단하게 정리하자면 과거의 SEO는 meta 태그를 참고하여 이용자에게 필요한 정보를 제공했다. meta는 지금으로 치면 # = 태그와 같다. 인스타나 기타 웹사이트에서 태그를 검색하면 해당 태그가 입력 되어있는 글들이 보이는 것처럼 meta태그에 해당 웹사이트에 대한 정보를 입력해두면 관련된 검색결과를 보여주는 방식이었으나, 검색 노출을 위해 관련없는 것까지 무분별하게 meta태그에 넣는 등의 분별력 없는 경우가 많아 최근에는 그 가치를 잃어버렸다. 그 대안으로 SEO최적화를 위해 고려되는 방법중 하나가 SSR(server side rendering, 클라이언트가 정보를 요청하면 필요한 정보를 서버에서 제공하고, 렌더링은 클라이언트측에서 하는 CSR과 반대로 렌더링까지 맞친 후에 클라이언트에 전달하는 방식 참조 : https://hahahoho5915.tistory.com/52)이다. 검색 엔진은 자동화된 로봇인 '크롤러'로 웹 사이트들을 읽는다. (웹 크롤러는 조직적, 자동화된 방법으로 월드 와이드 웹을 탐색하는 컴퓨터 프로그램이다. 웹 크롤러가 하는 작업을 '웹 크롤링' 혹은 '스파이더링'이라 부른다. 검색 엔진과 같은 여러 사이트에서는 데이터의 최신 상태 유지를 위해 웹 크롤링한다. -위키백과) 즉, 크롤러가 웹사이트를 읽는데 수월한 방식이 되어야 SEO 최적화에 유리한데 리액트와 같은 CSR방식은 자바스크립트가 실행되어서 렌더링이 완료되고 나서야 meta정보가 입력되고 크롤링을 할 수 있기 때문에 SEO에 불리하지만, SSR방식은 서버에서 이미 렌더링을 완료하기 때문에 크롤링에 유리하다는 것이다. next.js는 SSR을 제공하기 때문에 크롤링에 유리하다!
정리하다보니 관련된 정보 검색하고 길이 넘 길어지넹 )
또 js는 태생적으로 브라우저에서 작동하도록 만들어져있는데, node.js를 이용하면 브라우저가 아닌 환경에서도 작동하도록 할 수 있다.
- githup, aws : 깃 헙을 못하는 개발자는 없다!
위의 내용들은 말 그대로 사전강의로서 앞으로 배우게 될 공부의 선수지식을 들은 느낌이라면, 수업의 후반부에는 앞으로 부트캠프를 수료하면서 어떤 태도를 가지면 좋을지에 대한 강사님의 노하우가 있었다.
1. 남과 비교하지 말것
- 가장 중요한 점이라고 강조하셨다. 이것은 내가 남보다 못 할 때도 잘 할 때도 똑같다. 내가 남보다 능숙한지 미숙한지와 같은 순간들의 평가는 아무런 의미가 없다. 결국 중요한건 현재 나의 상태이기 때문이다. 내가 어떤 상태인지, 무엇을 모르는지에 대해 잘 파악하는것을 메타인지라고 하는데, 메타인지를 가져야 성장형 마인드가 세팅된다고 했다. 현재 내가 직면한 문제를 풀면서 오늘의 내가 어제의 나와 비교했을 때 1mm라도 성장한다는 것을 느끼는 것 그것이 중요하다고 말씀하셨다.
- 세계적으로 취업시장이 힘들고 특히 개발자 직종이 예전처럼 취업의 문이 넓은것은 아니지만, 그만큼 포기하는사람도 정말 많기 때문에 하루 1mm라도 성장하는 사람이 되어 포기하지 않으면 가능성은 계속 커지게 된다.
2. 기술의 스택만큼 중요한것은 경험과 태도
- 사실 주니어 개발자가 포트폴리오를 들고 왔을 때 남들보다 특출난 점이라던가 혹은 정말 이 코드를 이 사람이 스스로 짠게 맞는지에 대해 파악하기는 힘들다.
- 기업의 입장에서 주니어 개발자에게 원하는것은 문제를 해결해온 경험, 그것을 통한 새로운 기술에 대한 적응력, 그리고 동료들과 어떻게 협업했는지에 대한 협동스킬이라고 하셨다.
- 특히 협동 스킬에 대해 강조하셨는데, 내가 아는 것을 나눠야 내가 모를 때도 나눔 받을 수 있고 이 전의 주제로 돌아가 남과 비교하는 사람은 창피함을 가지기 때문에 이 과정도 제대로 하지 못할 수 있다고 말씀하셨다.
- 하드스킬(개발지식, 개발기술), 소프트스킬(협동, 커뮤니케이션, 태도) 둘 다 잘 가꿔야 한다.
3. 하루의 루틴, 스케줄 관리
- 몇시에 일어날지, 수업 후에 식사를 몇분까지 하고 몇분을 산책하며 그 후에 자기 전 얼마동안 개인자습 시간을 가지며 자유시간과 취침시간 정도의 하루 루틴을 정하고, 본인의 체력에 무리가 가지 않을 정도로 수업 이후의 시간을 잘 관리해야 한다. 6개월 하루 8시간 만의 수업으로 모든 지식을 얻을 수 있을거라고 생각하면 안된다. 중요한것은 수업 후의 시간을 어떻게 관리하느냐 이다.
4. 블로그
- 개발자 세계가 발전하는 가장 큰 이유는 오픈소스 형식 덕분이다. github, stackoverflow, 구글링 등 많은 개발자들이 내가 아는 지식을 공유하고 문제 해결 방식을 작성하여 그것을 서로 나누기 때문에 개발자 세상이 넓어질 수 있었다. 공부를 하는 사람의 입장에서도 매일 내가 오늘 공부한것 TIL을 쓰고 기록하는 습관을 가지는게 좋다. 처음부터 훌륭한 퀄리티의 블로그를 발행하는 것은 어렵지만 오늘 배운것을 짧게 남기는 등의 가벼운 시작이라도 해보자.
5. 학생으로서 chatGPT의 활용
- chatGPT에 영화소개 페이지 만들어줘 / 디자인은 깔끔하게 / nav바에 mypage, 로그인 버튼 만들어줘 / html,css 코드를 작성해줘라고 입력하면 1분도 채 안걸려서 깔끔한 웹 페이지 하나를 만들어준다. 즉 chatGPT는 우리가 원하는 문제를 정말 쉽게 해결한다. 학습자 입장에서 좋은 방법은 아니다. 스스로 고찰할 시간을 갖지 않기 때문에, 개발자로서 중요한 문제해결능력을 함양시킬 수 없기 때문이다. 그래서 chatGPT를 지혜롭게 사용하는 것이 중요하다고 말씀하셨다.
- 최소 30분은 스스로 고민해보고, 남에게 질문하면서 스스로 코드를 작성하여 오류를 해결하는 과정을 겪어 본 후
-> 문제가 해결 됐다면 GPT에게 이 코드의 베스트프랙티스나 클린한코드를 알려달라고 한 후 비교하며 연구
-> 문제가 해결되지 않았다면 오류메세지와 함께 GPT의 해결문을 이해하고 과정을 기록하고 이해하는 과정을 가질것
사전 교육의 내용은 여기까지 정리 할 수 있다. 개인적으로 정말 좋은 시간이었다. 내가 막연하게 독학하면서 생각했던 것들을 깔끔하게 정리했다. 독학러의 소중한 친구인 GPT의 활용이라던가, 냉정하게 취업문이 그렇게 넓지 않다는 점, 그리고 뭔가 부트캠프만 어떻게 들으면 취업이 되지 않을까 했던 안일한 마음도 다 잡을 수 있었다. 강사님은 6개월간 옆에서 코딩의 신이 과외를 해줘도 개발과정을 모두 습득하는것은 무조건 불가능하다고 하셨다. 결국 중요한것은 과정이 진행되고 끝난 후 나의 개별적인 노력인것이다.
오늘은 강의가 시작되기 하루 전이고, 어제 들었던 강의를 정리하는 포스트였기 때문에 길게 작성할 수 있었지만 아마 앞으로는 강의내용을 따라가기도 바쁘고 과제도 하다보면 이렇게 자세하고 길게 매일매일 작성할 수는 없을 것이다.
하지만 처음에 다짐했던대로 완벽하게 해내지 못한다고 망설이지말자. 중요한것은 내가 이런 과정들을 모두 겪어볼 수 있는 시간이 나에게 있고, 주위에 도와주는 좋은 사람들이 있다는 것이다. 화!잇!팅!