** 이력서 및 자기소개서 작성부터, 코딩테스트, 면접까지 나름 치열했던 2주를 기록해보고자 한다.**

1. 기업 정하기

ict인턴십에 참가하는 기업들은 총 170개 정도이며 최대 3개까지 지원할 수 있다. 3개를 잘 고르는 것도 능력이기 때문에 170개 모두 하나하나 읽어가며 신중하게 기업을 골랐다.

나만의 기준

1. 기술(개발) 팀 인력이 어느 정도 되는가? (웬만하면 기술팀 인력이 많은 기업으로 지원하고자 했다)
2. 실습생 지도 계획서를 읽어 보았을 때, 내가 진짜 하는 일(실무)이 있는가?
3. 내가 원하는 기술 스택을 우선적으로 채용할 것 같은 회사인가? (예를 들어, 프론트와 백엔드와 AI 개발자를 모두 채용하기를 원하는 기업이 있었는데, ict에서 배정한 실습생 인원은 1명인 경우가 자주 있었다. 그런 경우 해당 회사에서 가장 우선적으로 채용하고자 하는 실습생 업무가 프론트인 지 백엔드인 지 AI인 지가 회사 소개나 기업 담당자 Tip을 읽어보면 어느 정도 감이 잡힌다.)
4. 기업 담당자 Tip, 실습생 지도 계획을 꼼꼼히 읽어봤을 때 이 회사는 인턴에게 진심인가?
5. 거리가 가까운 가? 식비를 지원해 주는 가?
6. 채용 인원이 몇 명인가? (아무래도 1명을 뽑는 회사보다는 3명을 뽑는 회사가 확률이 더 높지 않을까라는 생각이었다)

고민을 많이 한 결과 Fullstack 개발자로 2군데, Backend 개발자로 1군데 기업을 선정했다.

2. 이력서/자기소개서/전공이수학점내역

지난 학기, 학교를 다니면서 급하게 이력서를 한 번 작성해 보았다. 10시간도 안 쓰고, 이력서나 포트폴리오를 어떻게 작성해야 하는 지도 모르는 상태에서 패기롭게 작성을 했었는데, 이번 인턴십 준비를 위해 이력서나 포트폴리오 작성법을 공부해 본 지금 시점에서 본 당시 자소서는 너무 안타까울 정도로 별로다... 물론 지금 이력서에 대해서도 부족한 점이 많다고 생각하지만 훨씬 발전된 지금의 이력서를 작성하면서 크게 6가지의 시행착오를 겪었다.

1. 대표 프로젝트는 2~3개면 충분하다. 강조하고 싶은 게 많아도 대표 프로젝트만 봐도 나라는 사람을 알 수 있을 정도로 어필만 잘하면 된다.
2. 내가 진짜 잘 할 수 있는 거만 기술 스택에 작성하자. 한 번 해 본 거 말고 진짜 잘 아는 것만 써야 면접에서 당황하지 않을 수 있다.
3. 디자인도 예뻐야 볼 맛이 난다. 실제로 디자인 때문에 이력서 갈아엎기만 최소 5번은 한 것 같다... 처음에는 노션으로 적다가 내 맘대로 레이아웃 배치하기가 생각보다 쉽지 않아서 포토샵도 사용하다가 결국 ppt로 만들었다.
4. 프로젝트 소개도 꼭 작성하자. 나는 이 프로젝트가 뭔 지 알 지만, 면접관 입장에서는 처음 보는 낯선 프로젝트일 뿐!
5. 어떤 고민을 했고, 어떤 어려움이 있었고, 사용자에 대해 고민을 해 보았는가 등 나의 문제 해결 능력을 보여주자. 스토리텔링이 중요하다
6. 지원할 회사별로 맞춤 전략을 세워보자.

이력서 작성에만 일주일 넘게 시간을 쏟고 결국 완성했고 뿌듯하지 않을 수 없었다:)

추가로 자기소개서와 전공이수학점내역을 제출했는데, 자기소개서는 지원 동기, 관심분야, 자기소개로 항목을 구성했고 (추가로 특정 기업에는 해당 기업에 대한 관심도를 보이는 항목도 작성했다) 기업 별로 다 다르게 작성했다. 해당 기업에 내가 어울리는 인재임을 어필하는 것에 큰 노력을 쏟은 것 같다.

ict 측에서 제출 서류의 양식이 따로 없고 자유롭게 구성하면 된다고 하길래, 나는 회사별로 '자기소개서 + 이력서 + 전공 이수 학점 내역'을 각각 다르게 작성해서 제출했다. 전공 이수 학점 내역의 경우 자신있는 대표 과목에 대하여 어떤 점을 배웠고 어떤 것을 공부했는지 간략하게 소개함으로써 전공학습에도 소홀히 하지 않은 사람이라는 것을 어필하고 싶었다.

3. 코딩테스트

해커랭크라는 플랫폼 (문제가 영어로 제공됨, 하루 전 날 해커랭크에서 몇 문제 풀어 보면서 플랫폼에 익숙해지려고 노력했다)으로, 5문제를 6시간 동안 풀어야했다. 코테 결과지를 보면 각 문제 당 소요 시간과 점수도 확인할 수 있었다. 문제 유형은 dp가 두 문제로 가장 많이 나왔고, 그 외 문제들은 대부분 구현, 해시, 정렬 정도였다. 1, 2, 3번 문제는 약 한 시간 정도만에 다 풀 수 있었을 정도로 쉬웠다면(백준 브론즈 정도의 느낌), 4번 문제(갑자기 백준 골드 정도)는 영어 해석부터 어려웠고 5번 문제(백준 실버 정도)도 나름 난이도가 있었다. 가장 어려웠던 문제는 4번 dp

4. 면접

서류 + 코딩테스트 결과를 합쳐서 서류 전형 합/불 결과가 나왔다. 운이 좋게도 서류는 모두 합격했다:) 강서구 S사는 코딩테스트를 보지 않는 회사였어서 가장 먼저 서류 합격 결과를 문자로 알려주셨고, 같은 날 서초구 J사와 성남시 G사에서도 연락을 주셔서 면접 날짜와 시간을 정할 수 있었다.

1) 강서구 S사

-> 2023-02-15 PM 02:00 ~ 02:40

1대다(1:2)면접, 40분 정도 진행, 자기소개 -> 회사 소개 -> 기술 질문 -> 포트폴리오 발표 -> Q&A 순서로 진행 미리 제출한 이력서 외에 포트폴리오를 추가로 요구하셔서, 급하게 프로젝트 중심의 포트폴리오도 만들어서 회사 방문

면접 질문

1. 자기소개
2. docker를 사용해 본 적 있나? 쿠버네티스는 알고 있나?
3. 클라우드 환경 경험이 있나?
4. 우리 회사는 ~ 것들을 하는 회사인데, 지원하게 된 이유가 무엇인가?
5. 취미가 무엇인가?
6. 인상깊게 본 서비스가 있다면 한 가지 이야기 해달라 -> 롤 얘기함... 어쩌다 보니 탑 가는 거까지 들킴
7. 포트폴리오 발표
8. 어떤 사람으로 성장하고 싶은가?

후기

회사에서 준비해주신 스타벅스 아메리카노☕️ 정말 감사했다:) 회사 소개를 해 주셨을 때, 인턴십 홈페이지에 적혀있는 업무와 다른 일을 하게 될 수도 있다고 하셔서 조금 당황하긴했지만, 스타트업의 특성 상 이런 부분은 어쩔 수 없다고 생각한다. 내가 긴장해서 딱딱하게 대답하면 분위기를 편하게 해 주시면서 대화하듯이 면접을 진행할 수 있어서 좋았다. 그치만 수요일 면접이였는데, 금요일 오전까지 했으면 하는 과제를 주어주신 것은 다음 날 다른 기업 면접도 있는 나로써는 너무 부담스러웠다 ㅠ^ㅠ

2) 서초구 J사

-> 2023-02-15 PM 04:30 ~ 06:00

다대다(3:2)면접, 1시간 30분 정도 진행, 자기소개 -> 기술 질문 -> 마무리 -> Q&A 순서로 진행 기술 질문의 경우, 다른 지원자의 질문을 이어서 옆 지원자에게도 하셔서 긴장을 놓을 수 없음

면접 질문

1. 자기소개 (선호하는 기술 위주로)
2. 패킷 통신 과정에 대해 설명하라
3. ORM이 무엇인가?
4. 회사에서 실제로 스프링 서버를 사용하지만, 분명 실습생 조건에는 Node.js를 요구하였다. 스프링이나 장고 경험만 있는데 왜 우리 회사에 지원하였는가?
5. http와 https의 차이점은 무엇인가?
6. JPA를 사용하는 이유가 무엇인가?
7. API를 만들면서 에러가 발생한다면, 어떻게 확인하고 해결할 것인가?
8. TCP와 UDP의 차이점은 무엇인가?
9. 추상화 개념에 대해 설명해 보아라
10. 커널과 OS의 차이가 무엇인가?
11. DB 색인 문제가 생긴다면 어떻게 해결할 것인가?(색인 개념을 몰라서 그냥 꼬리 질문 내내 어려웠음)
12. 검색이 느리다면 DB에서 어떻게 해결할 수 있는가?
13. sql 쿼리를 선호하는 이유가 무엇인가?
14. 소공에서 actor를 나누는 기준은 무엇인가?
15. 프로젝트를 진행해 보며 마주한 문제와 해결 과정을 한 가지만 말해라
16. 앞으로 어떤 개발자로 성장하고 싶은가?

후기

면접이 내가 예상한 방향과 다르게 기술 질문으로만 진행되어서 영혼까지 탈탈 털린 듯한 기분이었다. 나조차도 처음엔 당당하게 말했다면, 면접이 마무리되는 시점쯤에는 풀이 죽어 목소리가 작아지는 것이 느껴질 정도였다. 그렇지만 면접비라고 주신 스타벅스 카드는 정말 큰 위로가 되었다. 면접이 끝나자마자 떨어질 것 같다고 예상이 되었지만, 내일 면접 준비를 어떤 식으로 해야 할지를 알게 된 소중한 경험이었다. 면접 끝나고 만난 친구가 마라탕 사줘서 기분이 금방 풀리긴 했다.

3) 성남시 G사

-> 2023-02-16 PM 03:00 ~ 05:00

다대다(3:3)면접, 2시간 정도 진행, 자기소개 -> 일반 질문 -> 기술 질문 -> 마무리 -> Q&A 순서로 진행 기술 질문의 경우, A 지원자에게 한 질문은 대체로 B 지원자에게 묻지 않고 프로젝트 기반 맞춤형 새 질문을 주심

G사의 경우 원래는 1:다 면접 + 사전 미션에 대한 리뷰의 순으로 인턴십 면접을 진행해왔었으나, 이번에는 기한이 너무 촉박하여 다:다 면접 + 사전 미션 X 였음을 미리 알려주셨다

면접 질문

1. 자기소개
2. G사 서비스를 이용해 본 경험 및 어떤 점을 개선하고 싶었는지
3. G사에 대한 자신의 생각
4. 어떤 기준으로 기업을 선택했는가?
5. 어떤 회사에서 일하고 싶은가? 어떤 동료와 일하고 싶은가?
6. 본인이 자신 있는 점 (성격적으로도) 및 G사에서 어떻게 기여할 수 있을 것 같은가?
7. 어떤 개발자로 성장하고 싶은가?
8. 다음 코드의 콘솔창 출력 결과는? 왜 그렇게 생각하는가?
9. 동기 vs 비동기의 차이는?
10. url을 접속했을 때 페이지가 랜더링 되는 과정을 설명해 보아라
11. Google Vision API를 사용해서 OCR API를 구현했다고 했는데, 자신이 만든 OCR API가 프론트와 소통하는 과정을 설명해 보아라
12. RDBMS와 NoSQL의 차이는? 각각은 어떨 때 사용하는가?
13. 서비스 속도가 느리다는 사용자의 클레임이 있으면, 어떻게 해결할 것인가?
14. 리더로서의 경험이 많은 것 같은데, 어떤 식으로 프로젝트를 진행해왔나? -> 깃 칸반보드, 스프린트 단위 계획 등등 이야기 함
15. 갈등 및 갈등 해결 과정을 이야기해보아라
16. 본인은 팀을 위해 희생하는 편인가?
17. 프로젝트를 진행하며 마주했던 개발적 이슈와 해결과정을 이야기해보아라
18. 자신 있는 알고리즘을 하나 소개하라
19. G사에서 어떤 일을 하고 싶나? (풀스택, 프론트, 백엔드, 혹은 원하는 부서)
20. 앞으로 어떤 개발자로 성장하고 싶은가?

후기

판교에 대한 로망이 있는 사람으로서, 회사 건물이 너무 멋있었다. 버스 타고 도착하자마자 여긴 꼭 붙어야겠다는 생각이 들더라. 바로 전 날 두 번이나 면접을 봐서 그런가, 확실히 덜 긴장한 채로 시작할 수 있었다. 세 분의 면접관께서 서로 농담도 하시며 분위기를 편안하게 만들어주신 점도 좋았다. 가장 취약한 기술 질문에 대해서도 대비를 좀 하고 가야 한다는 것을 어제 뼈저리게 느껴서, 면접 질문에 대한 대답도 어제보다는 더 많이 할 수 있었다. 물론 오늘도 모르겠는 질문들도 있었지만, 어제보다는 성장했음에 만족을 하며 결과가 나오는 날까지 숨 참고 Love Dive 👯‍♀️

4) 전체적인 면접 후기

1. 면접은 많이 볼 수록 경험치가 쌓인다. (하면 할 수록 느는 느낌)
2. 각 회사에 대해 미리 알아보고, 해당 회사에서 만든 서비스를 미리 이용해보자. +서비스를 사용하면서 느낀 점이나, 피드백 하고 싶었던 부분까지 꼭 생각을 해 보아야 함.
3. 기술 질문은 미리미리 대비하자. CS 공부는 하루 아침에 되지 않는다.
4. 친구랑 서로 모의 면접을 해 보자. (친구가 짚어 준 질문이 실전에서도 꽤 많이 나왔다)
5. 내 프로젝트에 대해서는 완벽하게 말할 수 있는 상태여야한다. (프로젝트 설명 및 자신의 역할과 기술 등 완벽하게 숙지하고 입에 착착 붙도록 말로도 내뱉어보자)
6. 면접 장소에는 20분 전에 도착할 수 있도록 여유롭게 출발하자.
7. 해당 회사에서 요구하는 기술 스택에 대해서 아는 것이 많을 수록 좋다. 얕은 개념이라도 미리 공부해가자.
8. ict홈페이지에 보면 기업 담당자 Tip에 면접에서 어떤 것을 위주로 진행하는 지 알려주기도 한다. 그걸 1000000퍼센트 신뢰해서는 안된다. 예를 들어 프로젝트 위주로 면접을 진행한다고 되어있는 회사에서 기술질문만 할 수도 있고, 회사 서비스를 사용해 본 경험에 대해서 면접에서 이야기를 나누겠다고 되어있는 회사에서 해당 내용은 아예 물어보지 않을 수도 있다. 힘들어도 전체적(cs, 프로젝트, 프로젝트 기술, 회사 및 직무 fit 등등)인 걸 골고루 밸런스 있게 준비해가는 것이 정답인 것 같다.

모든 면접이 끝나고, 2주 동안 고생한 나 자신을 스스로 칭찬하며 오랜만에 lck 보면서 육회비빔밥 야무지게 먹었당:)

5. 최종 결과

가장 가고 싶던 1순위 기업인 구름에 합격했다!!!!!!!! 내 눈에 너무 매력적인 회사여서인가 경쟁률이 치열할까 봐 겁 많이 먹었었는데, 지원하길 잘했다는 생각이 든다. 합격이라는 글자 보자마자 배가 싸악 고파지는 magic🧙

실무 경험과 인턴이 모두 처음이라 너무 설레고 행복하고 기대된다. 앞으로 node.js(노드 경험이 없는 것이 걱정이었는데 다행히 붙었다!_!)랑 react공부도 열심히 해야할 것 같다.

지금 열정 잊지 않고 성공적으로 인턴 생활을 마무리하고 성장해나가고 싶다😃

이번 '도란쌤' 프로젝트는 front의 역할이 비교적 더 많아서 나랑 은서가 front를 react로 개발하고 승아가 back을 주로 담당하기로 했다.

본격적으로 팀플이 시작되고 리액트 프로젝트 협업을 위해 정해줬던 요소들을 정리해보고자 한다.

1. 폴더 구조

리액트 공식 문서에서 추천하는 방식은 크게

1. 기능 또는 경로 별 그룹화
2. 파일 유형별로 그룹화 (아토믹 디자인) 이렇게 두 가지라고 한다.

사실 폴더 구조에 정답은 없지만, '현업에서 많이 사용되는 방식인가, 기능이 많은 프로젝트에 적합한가, 나와 팀원에게 편한가'를 기준으로 아토믹 디자인을 응용한 파일 유형별로 그룹화의 방식을 선택하기로 했다.

이와 관련하여 참고한 포스트1 , 참고한 포스트2 이다.

2. Context API vs Redux

상태관리 라이브러리를 정해야한다. 리덕스에 대해 공부한 뒤, velopert 선생님의 추천에 따라 위의 질문에 대한 대답이 모두 Yes였기 때문에 리덕스로 결정하였다.

3. yarn vs npm

Javascript packaging tool을 팀원과 통일해서 사용하길 권장한다고 해서 우리는 yarn으로 정했다. 속도, 보안성 등을 이유로 yarn 이 라이징 스타라길래 yarn으로 정했는데 사실 npm도 버전이 업데이트 되면서 차이가 거의 없어졌다고 하니, 그냥 취향에 따라 결정하면 된다고 한다. yarn이냐 npm이냐의 선택보다는 한 프로젝트에서 충돌을 방지하기 위해 패키지 매니지 툴을 통일하는 것이 더 중요한 것 같다.

4. 커밋 컨벤션 정하기

커밋 양식은 다음과 같이 정했다.

Feat : 이미지용 버튼 컴포넌트 생성

또한 커밋 컨벤션은 다음과 같이 정했다.

Feat - 새로운 기능 추가
Fix - 버그 수정
Design - Design 변경
Style - 코드 포맷 변경, 세미콜론 누락, 디렉토리 구조 변경 등 코드 수정이 없는 경우
Refactor - 코드 리팩토링
Comment - 필요한 주석 추가
Build - 빌드 툴 업데이트, 패키지 매니저 설정 등 (프로덕션 코드 변경 X)
Remove - 파일을 삭제하는 경우

5. 브랜치 생성, Issue, PR, 칸반 보드 작성 Rule

1) 브랜치 생성

이름/기능 이 기본적인 생성 Rule이다. 예를 들어 inkyeong/paint 에서는 내가 그림판 관련 작업을 하는 브랜치인 것이다.

2) Issue

깃헙에서 다음과 같이 내가 이슈 템플릿을 생성해 놓았다.

이슈 템플릿을 활용하여 이슈를 생성하고, 할 일(기능)은 최대한 세세하게 나누어서 작성하는 것을 원칙으로 정하였다. 이슈 템플릿은 Backend repository에서도 동일하게 사용하기로 했다.

3) PR

A가 풀리퀘스트를 날리면 B가 내용을 확인하고 main에 머지하는 것을 원칙으로 정하였다. 이렇게 함으로써 서로 협업할 때 프로젝트와 관련해서 코드 충돌을 줄이고 상대의 작업 내용을 점검할 예정이다.

4) 칸반보드

칸반보드를 Github의 Projects에서 작성할 것인가 기존에 사용하던 팀노션에서 작성할 것인가를 고민했는데, 우리는 Github의 Projects를 이용하기로 결정했다. 노션에서는 프로젝트의 기획 관련 된 부분들 및 팀 일정, 문서 관련한 작업들에 대해서 공유하고 코드 작업와 관련된 작업들은 모두 깃헙에 모으는 것이 좋을 것 같다는 판단을 했다. 또한 깃헙의 Projects에서 칸반 보드를 작성하면 Issue와 연결시키기도 편하다는 장점이 있다.

단순히 '@@에 합격하기 위해 코테 공부를 시작해보자'는 마음가짐이 지금까지 내가 알고리즘/코테 공부를 꾸준히 공부하는 데에 실패했던 이유였다고 생각한다.

중학교 2학년 때 도덕 선생님께서

계획을 지키는 가장 좋은 방법은 많은 사람 앞에서 공표하는 것이다

라고 하셨다. 그렇기에 이 글을 통해 앞으로 나의 알고리즘/코테 공부 계획을 작성해 보고자 한다.

코테 언어 : Python

선정 이유

나는 아직 서버 개발자/프론트 개발자 중 어떤 전문 분야의 개발자로 성장하고 싶은 지 정하지 못하여, Django(python), Springboot(Java), React(Javascript) 등 여러 프레임워크 및 언어로 개발활동을 해오고 있다.

여러 언어들 중 Python이 일단 가장 쉽다!! 동적 타입 언어라서 변수를 선언할 때 타입을 지정하지 않는다는 점이 C나 Java에 익숙한 나에게는 Python의 단점으로 다가왔다. 나는 이미 변수 타입 지정이 습관화 되어있는 상태이고, 코드 실행 도중 예상치 못한 타입으로 에러를 발생하는 경우가 자주 생기기 때문에 이 점이 언어를 선정할 때 가장 큰 걸림돌이였지만, 언어를 배우고 복잡한 알고리즘도 비교적 구현하기 쉬워진다는 장점 앞에서는 걸림돌도 별 거 아닌 게 되었다. 또한 막히는 문제에 대해서 도움을 얻을 수 있는 레퍼런스도 내 경험 상 Python이 가장 많은 것 같았다.

공부 방법

1) github 1일 1커밋 이상 ( + 개인 노션 Habit Tracker에 체크 )

기존에 주연이랑 같이 공부하던 깃헙 레포지토리에 내 폴더에 꾸준히 커밋할 예정이다.

2) '이것이 취업을 위한 코딩 테스트다 with 파이썬' 책

코딩테스트를 준비를 이미 경험한 주변인들에게 물어봤을 때 가장 많이 추천해 준 책이였다.

3) 우선적으로, 프로그래머스 ~ Level.3 + 백준커리큘럼에 따라 문제 선정

이미 프로그래머스의 코딩테스트 고득점 Kit는 2021년에 대부분 풀었다. 그럼에도 불구하고 자주 나오는 유형의 문제들에 대한 확신이 안 들었기 때문에, 더 많은 문제들을 풀어보는 것이 중요하다고 생각했다. 그래서 인터넷 검색을 통해 백준 커리큘럼표를 얻었다. 해당 커리큘럼에서 추천해 준 문제를 우선적으로 고려해서 백준 문제를 적극적으로 풀어볼 것이다.

4) velog에 알고리즘 포스트 작성

'모든 문제에 대해 포스트를 적겠다'라고 목표를 정해 버리면 기록하는 걸 가장 귀찮아하는 나의 성격 탓에 결국 코테 공부(문제 풀기)까지 하지 않게 되는 최악의 상황으로 이어질 거란 걸 잘 안다. 이미 그렇게 실패해 보았다. 그렇지만 실패는 성공의 어머니라고. 그래서 '문제를 풀다가 무언가를 새롭게 알게 되었을 때, 자주 사용할 수 있을 것 같고 다음에 또 이 개념을 찾아보게 될 것 같다고 예상될 때 내가 참고하기 위한 포스트를 내 입맛대로 적겠다'로 스스로 정했다.

단기 계획 (유동적으로 Update)

2022.8.13 ~

중앙대학교 소프트웨어학과 전공 필수 과목 중 '코딩부트캠프'라는 과목이 있다. 코붙캠은 알고리즘 문제를 풀고 P/F을 받는 과목인데, 미리 방학 때 빡세게 준비해서 학기 중에 다른 일에 신경을 쓸 수 있도록 대비하겠다.

mysql과 springboot 연동과 관련된 모든 설정을 바꿔봐도 java.lang.NullPointException 에러가 발생하여 setter의 값과 자료형이 일치하지 않는 가를 재확인하였지만 그 문제는 아닌 것 같았다.

에러를 해결한 방법은

public class UserRepositoryTest extends DiggingApplicationTests

즉 extends DiggingApplicationTests를 해주지 않아서였다.

Main 디렉토리에는 DiggingApplication 클래스를 통해 Main 함수가 실행된다면 Test 디렉토리에는 DiggingApplicationTests 클래스를 통해 Test 작업이 실행되는 것이기에 상속받아 오지 않을 시 Test 작업 자체가 이루어지지 않았던 것이다.

처음 springboot를 공부하는 과정에서 NullPointerException을 자꾸 마주치게 되는데 상속을 하지 않았던 실수는 에러의 이름으로 유추할 수 없는 실수였다. 다음부터는 이 부분도 꼭 확인해서 실수 시간을 줄여야겠다.

1. backend 폴더 생성 후 가상환경 설치 및 활성화

   mkdir backend
   cd backend
   python -m venv venv
   source venv/Scripts/activate

2. django 설치 및 djangorestframework 설치

   pip install django
   pip install djangorestframework        _drf 용도_

3. 프로젝트 및 앱 생성

django-admin startproject config .

2. [Frontend] React 설치

1. create-react-app 설치

• 앞서 생성한 backend 폴더와 같은 경로에 frontend 앱이 생성되도록 경로 이동

  npx create-react-app frontend

2. React 실행 확인

cd frontend
yarn start

yarn start 후 성공하면 다음과 같은 화면이 실행됨!

• Ctrl+C 누르면 실행 종료

3. Django와 ReactJS 연동

1. Django webpack-loader 설치

• 가상환경 활성화한 후 설치할 것!

  pip install django-webpack-loader

2. Django 프로젝트 폴더 내 settings.py 파일 수정

1) INSTALLED_APPS에 'webpack_loader', 'rest_framework' 추가

2) TEMPLATES에 DIRS 수정

'DIRS': [os.path.join(BASE_DIR,"templates"),],

3) STATICFILES_DIRS 추가

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'assets'),
)

4) WEBPACK_LOADER 추가

WEBPACK_LOADER = {
    'DEFAULT': {
        'CACHE': not DEBUG,
        'BUNDLE_DIR_NAME': 'webpack_bundles/', # must end with slash
        'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats.dev.json'),
        'POLL_INTERVAL': 0.1,
        'TIMEOUT': None,
        'IGNORE': [r'.+\.hot-update.js', r'.+\.map'],
        'LOADER_CLASS': 'webpack_loader.loader.WebpackLoader',
    }
}

3. test를 위한 index.html 파일 생성

현재 디렉토리 구조 !

• config 프로젝트 내에 templates/config/index.html 생성 및 내용

{% load render_bundle from webpack_loader %}

<!DOCTYPE html>
<html>
<body>
    {% render_bundle 'main' %}
</body>
</html>

프로젝트를 위해 django와 react를 연결해야 할 일이 생겼는데 react 개발을 해 본 적이 없다보니 초기 셋팅하는 데 개발 블로그에 정의된 것들이 내 작업환경에서는 명령어가 다른 오류들이 나타나 여러 번 삽질하다가 알게 된 사실을 기록해놓고자 한다.

프로그램을 설치할 수 없는 환경이라면?

코드샌드박스라는 서비스를 통해 브라우저에서 사용 가능

codesandbox 사이트에서 Create Sandbox -> Open React를 하면 웹 브라우저 내에서 리액트 환경을 준비할 수 있음

1. Node.js

• Node.js는 브라우저 환경이 아닌 곳에서도 자바스크립트를 실행할 수 있게 해주는 자바스크립트 런타임
• Webpack, Babel 같은 도구들이 Node.js를 기반으로 만들어져서 설치를 해야한다.

1) Node.js 공식 홈페이지에서 좌측에 나타나는 LTS 버전으로 설치

2. yarn

• 자바스크립트 패키지를 매니징하는 도구
• Node.js의 npm과 비슷한 도구 (npm 보다 빠른 속도)

1) Yarn 공식 홈페이지의 Install Yarn 가이드를 따르면 됨 (2021.02.09 기준)

• Install via npm

  npm install --global yarn

• Check installation

  yarn --version

3. [Editor] Visual Studio Code

4. gitbash -> UNIX 기반 명령어 사용 가능

1. CS 전공지식

1. 신입개발자가 알아야 할 전공지식/기술면접

2. 파이썬 알고리즘

1. 파이썬 알고리즘 인터뷰

2. 잔재미 코딩, 알고리즘/기술면접 올인원

3. '이것이 취업을 위한 코딩 테스트다' 책

1, 2 사이트와 3번 책을 통해 알고리즘 개념만 익히고 백준, 프로그래머스 3단계 정도까지 풀면 카카오 코테 정도는 왠만하면 풀 수 있다고 한다.

3. 코딩 에러

1. C언어 및 VSCode 에러

4. UX

1. 서비스를 뜯어서 고민한 것을 정리한 블로그

2. 토스 UX라이터가 분석한 보이스앤톤 가이드라인

3. Spotify의 유저 리서치 방식

5. 동기부여 & 자극

1. 개발자 쟈미님의 devlog

Representational State Transfer

RESTful이란?

http의 url과 http method(GET, POST, PUT, DELETE)를 사용해서 API 가독성을 높인 구조화된 시스템 아키텍쳐

스마트폰이 등장하며, HTML로 렌더링 하는 웹서버를 넘어 JSON, XML 같은 형식을 통해서 데이터를 다루는 API서버가 필요해지며 등장.
라우팅이나 기존 새로고침을 통해 제공해야 했던 데이터의 변경을 프론트엔드에게 넘겨주고, 백엔드에서는 그저 DB에 접근해 요청에 맞는 데이터를 제공하는 API 서버를 개발

REST(Representational State Transfer) 구성

1. 자원(RESOURCE) - URI
2. 행위(Verb) - HTTP METHOD
3. 표현(Representations)

API란?

Application Programming Interface API를 사용하면 구현 방식을 알지 못해도 제품 또는 서비스가 서로 커뮤니케이션할 수 있으며 애플리케이션 개발을 간소화하여 시간과 비용을 절약할 수 있다.

API 연동이 필요한 이유

우리가 웹 어플리케이션을 만들 때 데이터를 브라우저에서 사용자 본인만 볼 수 있는 게 아니라 다른 사람들도 볼 수 있게 만들기 위해서, API 서버를 만들고 이를 연동해서 데이터를 읽고 써야한다.

REST API 특징

REST API 참고 사이트 REST API : 클라이언트와 서버가 소통하는 방식

1. URI는 정보의 자원을 표현해야 한다.

  GET/members/delete/1

위와 같은 방식은 REST를 제대로 적용하지 않은 URI임. URI는 자원을 표현하는데 중점을 두어야 합니다. delete와 같은 행위에 대한 표현이 들어가서는 안됨.

2. 자원에 대한 행위는 HTTP Method(GET, POST, PUT, DELETE)로 표현한다.
위의 잘못된 URI는 다음과 같이 수정되어야 함.

  DELETE/members/1

DRF(Django Rest Framework)란?

Django 안에서 RESTful API 서버를 쉽게 구축할 수 있도록 도와주는 오픈소스 라이브러리

DRF를 사용하는 이유

1. 웹 브라우저 API는 범용성이 커서 개발을 쉽게 만들어준다. 웹에서만 적용되는 것이 아니라 앱이나 여러 http 프로토콜로 통신하는 프로젝트에 그대로 적용될 수 있어 활용성이 좋다.

2. 인증 정책에 OAuth1, OAuth2 를 위한 추가적인 패키지가 추가되어 있는 경우에 사용한다.

3. 시리얼라이즈 기능을 제공해준다. (DB data -> JSON)

   Serializer : 직렬화하는 클래스

4. 문서화 및 커뮤니티 지원이 잘 되어있다.

Django REST Framework 설치

공식 튜토리얼 문서 바로가기 Click

1. 가상환경 설치 후 활성화

   python -m venv venv
   source venv/Scripts/activate
   

2. django 설치 및 djangorestframework 설치

pip install django pip install pillow 이미지 관련 pip install requests pip install djangorestframework drf 용도 pip install django-rest-knox 회원가입 용도

3. 프로젝트 및 앱 생성

django-admin startproject config . python manage.py startapp [app_name]

4. settings.py -> INSTALLED_APPS에 'rest_framework', 'knox', '[app_name]' 추가

일만 벌리는 사람이 아닌 일을 벌리고 수습도 하는 책임감 있는 사람이 되어야만 한다 !