1. Node.js 설치

우선 Node.js 설치를 해야합니다. 설치에는 여러가지 방법이 있지만, Homebrew를 이용하거나 Node.js 공식 사이트에서 .dmg를 다운 받는 방법이 있습니다.

1) Homebrew 이용한 설치

homebrew 설치

cmd에 아래 코드를 실행 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 사용중인 mac 비밀번호 입력(cmd 화면에서 비밀번호는 노출되지 않습니다.) 정상 설치 확인 brew --version! 위처럼 뜨면 정상적으로 설치 완료.

nvm 설치

brew install nvm 설치됐는지 확인 nvm --version 만약에 nvm --version 했는데 zsh: command not found: nvm 이렇게 뜬다면 경로 미등록으로 인한 로그로 인텔맥 기준 echo '[ -s "/usr/local/opt/nvm/nvm.sh" ] && \. "/usr/local/opt/nvm/nvm.sh"' >> ~/.zshrc source ~/.zshrc 이렇게 등록해 준 뒤 다시 nvm --version 하면 정상적으로 버전이 뜨는 것을 확인 homebrew 경로가 인텔 맥은/usr/local, M1부터는 /opt/homebrew/로 수정해서 경로 설정해 주면 된다.

Node.js 설치

Node.js 설치에는 두가지 방법이 있다.

1. https://nodejs.org/ko/download 여기서 원하는 버전을 직접 다운로드 후 설치
2. nvm install 버전으로 원하는 버전 직접 설치하기 둘 중 편한 방법으로 진행 하면 되며, 설치 완료 후 확인은 node -v 하면 설치한 노드의 버전이 나온다. npm도 동일하게 npm -v 하면 설치된 npm의 버전이 나온다.

   Nest.js 설치

   cmd에 npm install -g @nestjs/cli 하게 되면 바로 설치가 완료 된다. 설치 완료 후 Nest.js를 이용한 프로젝트를 만들고 싶다면 cmd창이나 vscode 터미널 등에서 원하는 폴더 경로까지 cd로 이동한 후 nest new 프로젝트명 입력하면 해당 폴더에 새로운 Nest.js의 프로젝트가 만들어져 있다.

편입 후기는 해당 포스트를 봐주시면 감사하겠습니다 :)

⚠ 앞에 사족이 많으니 바쁘신 분들은 수강평쪽으로 내려가시면 수강 후기를 보실 수 있습니다 :)

수강 내역

우선, 3학년 2학기 내가 수강했던 과목은 사진으로 보시다시피 6전공을 이수했습니다. 방통대 3학년 편입같은 경우 교양과목은 학점 인정이 되어 별도로 수료할 필요가 없어 6전공으로 배치 했었습니다!

6전공 후기

6전공의 후기는.. 정말.. 정신없는 3달.. 이라고 표현할 수 있겠습니다.. 분명, 신청할 당시에는 업무도 막 바쁘지 않아서 여유롭게 신청했는데, 4분기에 회사에 큰 프로젝트가 있어서 정말 기말고사 시즌에는.. 이게 사람 사는게 맞나 싶을 정도로 주중에는 무한 업무 주말에는 무한 공부로 살았던거 같네요ㅠㅠ

방통대 신청하기 전에 어떤 블로거님께서 타노스 공부법을 하셨다고 하셨는데 그때 보고 타노스 공부법이래 ㅋㅋㅋ 했던 제 자신이 부끄러워졌습니다... 저도 타노스 해버렸거든요.. 기말을 토/일 각 3과목씩 배치하여 시험을 봤는데 딱 반만 살리고 반은.. 아주 처참하게 버렸습니다.. 공부할 때도, 반만 살린다는 마인드로 3과목만 집요하게 파고 3과목은 버렸더니 딱 공부한 그 과목들만 B가 나오고 나머지는.. 네.. C와 D가 아름답게 적혀있네요😥

학점 소개

타노스 공부법하면서 날린 과목은 계절학기나 다음 2학기에 재수강할 생각으로 했기 때문에.. 이번 학기도 5전공 1일선 했습니다(네?!ㅋㅋㅋㅋ)

왜 저렇게 신청을 했냐면.. 131학점 중 교양 33학점, 전공 30학점이 기본으로 인정이 되며, 인정학점 포함 전공 69학점을 채우고 그외에 빈 학점은 일선으로 채우면 되기 때문에 제 전략은 초반에 전공을 6꽉을 한 후 B 이하의 학점은 계절이나 4학년때 채울 심산입니다😎

수강평

1. 원격대학교육의 이해(교양 1학점) 이건 학교에서 거져주는 과목입니다. 수강만 해도 1학점 주는 과목이기에 다들 놓치지 말고 수강하세요! 2. 컴퓨터과학 개론(전공 3학점)

전반적인 평가

다들 개론 피하라고 했는데 솔직히 대학교에서 개론을 안 듣는게 말이 되는건가 싶어서 들었습니다. 내용은 정말 컴퓨터과학의 전반적인 부분을 다루고있으며, 자료구조와 겹치는 부분이 있어 공부할 때 조금 수월했습니다.

성적

이 과목은 중간 과제 대신 화상수업+과제로 이루어진 수업이며, 수업 범위가 컴퓨터와 자료, 자료구조 정도의 내용을 다루며 과제는 문제당 한장이상 작성 요구하여 조금 힘들었지만, 내용은 착실히 듣기만 했다면 크게 어려움 없이 풀 수 있는 내용이었습니다.

3. 멀티미디어시스템(전공 3학점)

전반적인 평가

이거.. 꿀과목이라고 해서 들었는데요.. 이게 제가 피지컬로 볼 줄 알고 공부 하나도 안 하고 갔다가 C로 날려먹은 과목입니다.. 기말고사는 공부 하시길..

성적

이 과목은 중간 과제가 영상을 만들고 시나리오를 word로 작성해서 내는 것입니다. 주제는 학번의 끝자리의 홀/짝에 따라 다릅니다. 과제는 솔직히 너무 꿀입니다. 대신 올릴 때 용량에 걸리지 않도록 타 사이트의 도움을 정말 여러번 받았습니다.. 그리고 영상 길이가 1분 30초인가? 그 정해진 시간을 넘기면 안 되서 마지막날까지 수정했던 기억이 있네요. 이것도 성적 후하게줍니다! 기말은.. 고오오냥 암기과목입니다. 솔직히 이건 제가 공부를 안 해서 뭐라고 말씀 드릴 것이 없네용 4. 자료구조(전공 3학점)

전반적인 평가

이건 개발자라면 이 학과 수강을 한다면 무조건 들어야하는 과목이라고 생각합니다. 다만, 교수님이 호불호가 정말 많이 갈리는 교수님이라 안 맞는 사람들은 힘들 수 있습니다만 저는 이 과목 재미있었습니다. 단점은 교수님 투머치 토커라서 영상이 두개입니다. 전 차마.. 성적에 포함 안 되는 영상까지 볼 기력이 없어 형성평가에 카운팅 되는 영상만 봤습니다..

성적

이 과목은 중간 과제 대신 화상강의+과제 였으며, 컴과개론처럼 문제당 1장 이상 작성해야하며, 일부 문제는 컴과개론과 유사했습니다. 당연하긴 한데 컴과개론 초반이 배열 스택 큐 이부분을 다루기 때문에 어쩔 수 없다고 생각합니다. 문제는 풀만 했고, 점수도 후하게 주십니다. 기말고사도 오히려 전 이 과목 공부하기 편했습니다. 처음에 개념 이해만 잘 한다면 풀기 쉽습니다. 손으로 끄적이면서 푸는거 좋아해서 시험 보기 전에 종이 1장 요청해서 종이 받아서 적어가며 풀었던 것같습니다.

5. 프로그래밍언어론(전공 3학점)

전반적인 평가

중간 과제부터 어려운 이 과목.. 구문론과 의미론, 구문분석 이 두 강은 너무 어렵다리.. 뒤로 갈 수록 아는 내용이라 C+로 살린 과목.. 그나저나 교수님 왜 눈감고 강의 하실까요..?

성적

이 과목은 중간 과제가 정말 어렵습니다.. 유일하게 중간 과제 점수가 30점 만점이 아닌 과목입니다. 진짜 아직도 BNF와 EBNF 문제는.. 설명을 봐도 모르겠네요..😥 기말고사는 이 과목도 타노스 과목이라 진짜 공부를 많이 못하고 가서 C+ 받았네요.. 이건 나중에 계절학기 때 다시 파볼 과목입니다..

6. UNIX 시스템(전공 3학점)

전반적인 평가

안녕하세요 VIM 쓰는 백엔드 개발자입니다(쾅!) 안녕히 계세요.. 말하는 감자는 굴러갑니다.. 네.. 피지컬 믿고 했다가 기말고사에서 말도 안 되는 세세한 옵션때문에 조지고 나왔습니다.

성적

이 과목 중간 과제는 VIM을 쓰는 저에겐 식은 죽 먹기입니다 후후 이게 폐인이었을까요.. 피지컬 믿고 다른 과목에 올인했더니 이 과목이 리얼로 처참해서 누구한테 말도 못할 성적이 나왔습니다. 전 그저 말하는 감자새끼입니다 감자 감자 옵션이 정말.. 허허 다양했더라구요..?ㅋㅋㅋㅋ 😥

7. 시뮬레이션(전공 3학점)

전반적인 평가

교수님은 천사십니다. 어려운 과목인걸 알고 너무 친절하게 정말 친절하게 답변해주십니다. 처음에 강의 듣고 단 하나도 이해하지 못해 절망스러웠는데 교수님 질문판에 질문 남기면 너무 친절하게 알려주십니다. He is Angel🧚‍♂️

성적

이 과목도 중간 과제 제출이며, 중간 과제 내용이 간단하게 프로그래밍 다운해서 돌린 뒤 그 결과를 분석해서 제출 하는 것이었습니다. 여기서 꿀팁은 천원만 내면 학교 신문? 같은걸 볼 수있는데 거기에 교수님의 과제 꾸르팁이 있습니다. 그걸 보고 과제물 푸시면 달달한 만점 주실겁니다. 기말고사는 이 과목에 꽤 올인 했었어서 무난하게 점수를 받았으며, 시험 보실 때 꼭 A4 용지 받아서 시험 보세용 이것도 약간의 산수를 요하기 때문에 종이랑 펜은 필수입니다.

이직

출처: irasutoya

올해 초만 해도 이전 회사에서 여러가지 이슈로 인해 이미 마음이 뜬 상태에서 1년만이라도 버티자 라는 심정이었지만 결정적으로 다음 프로젝트 방향성이 저와 맞지 않았고, NFT 쇼핑몰과 NFT 쇼핑몰 관리자 페이지까지만 오픈 하고 바로 퇴사하게 되었습니다. 이직 면접 당시에도 꼭 저 쇼핑몰만 오픈하고 퇴사를 하고싶다고 말씀을 드렸었고, 3월에 쇼핑몰을 오픈하고 퇴사하게 되었습니다.

구직을 오픈하면서 다양한 플랫폼에서 채용 관련 연락을 받았고, 커피챗이나 면접을 보면서 처음으로 손코딩으로 풀어보고, 기술면접도 통과해보면서 느낀건 나는 코드만 짤 줄 알지 깊이 있게 생각을 해본 적이 없다는 것과 네트워크에 대해서 공부 해야겠다는 생각이 들었습니다.

여러 면접 끝에 현재 회사를 선택하게 되었고, 회사에서 능력을 인정받아 입사 후 반년만에 연봉 조정을 거쳐 입사 당시 보다 20% 이상 인상하였습니다.

업무

출처: irasutoya

이전 회사에서는 jQuery와 순수 JS 위주로 코드를 짜고, 이땐 웹사이트 작업을 주로 하다보니 크롬 개발자 도구에 뜨는 에러나 alert과 console.log로 디버깅으로 작업을 했었습니다. 저때는 node.js를 잘 모르던 시절이라 Passport.js가 무엇인지 파악하는데 1주일을 쓰곤 했지만 저 경험 덕분에 한층 더 강해진 주니어가 된 것같습니다. 현 회사로 이직하고 나서는 제가 원하던 백엔드 개발자로 근무하게 되었습니다. 현재 회사의 스팩은 Node.js(Express), Jenkins, Mysql, AWS S3, RDS 를 사용 하고 있습니다.

3월~4월

입사 기간에 회사가 바쁘지 않아 온보딩 기간을 한달 좀 넘게 갖게 되었습니다. 처음에는 확률을 적용한 출석체크 기능 개발 과제와 Rollback 과제를 받아 진행했습니다. 이때, Clean code에 대해 많이 지적을 받았고, 부끄럽지만 저당시 저는 if, while, for문만 쓸줄 알지 map이나 forEach나 some 같은 문법을 쓸줄 몰랐던 때여서 코드 리뷰를 받으면서 점점 로직도 경량화를 하고 Clean code에 맞춰가기 시작했습니다.

6월

DB에 있는 고객의 데이터를 이용하여 맞춤형 광고를 작업했습니다. 각 페이지 별 어떤 상품을 광고로 띄울지, 앱 이용 시 몇 번의 횟수로 띄울지 등을 고려하여 고객의 데이터와 비교해 자주 구매한 상품 위주로 추천하는 로직을 개발했습니다. 이때, 처음으로 복잡한 기획 문서를 보고 기획팀과 소통하며 작업을 해봤습니다.

7월

처음으로 개발 API문서를 보고 자사 서비스에 붙이는 것을 작업 했습니다. 자세한 내용은 Iamport 연동기 여기를 참고해 주시면 감사하겠습니다 ;)

10월~12월

본격적으로 앱 3.0 개편 작업이 시작 됐습니다. 이때 저는 메인 서버 개발자로서 폴더의 기초 생성부터 서버에 붙이기까지 전 부분을 담당하였고, 시니어의 도움으로 많은 것을 얻어간 개편이었습니다. 처음으로 Jenkins에 Github 레포지도 붙여보고, Ngnix를 이용하여 서버 등록도 해보고, 회사의 기준이 되는 코드 컨벤션을 짜면서 많은 고민을 하면서 1.5년차에 귀중한 경험을 하였습니다. 개편된 앱은 12월 마지막주에 오픈하여 지금까지 큰 에러 없이 순항하여 굉장히 뿌듯하지만 한편으론 아직 발생하지 않은 오류가 있을까 두렵기도 합니다.

앱 개편에 관한 내용은 추후 Velog에서 다뤄볼까 합니다.

업무 외 일상

방통대 편입

우선, 제가 방통대 편입 여기서도 언급했지만 방통대에 편입을 했습니다.. 한 학기를 다닌 후기는.. 되도록이면 1학기부터 다니는 것을 추천합니다. 2학기는 일부 과목들이 1학기가 선수로 진행됐음을 가정하고 진행하기 때문에 C에 대한 기초가 없는 분이라면 이해하기 어려운 부분이 있습니다. 저 또한 그런 부분에서 크게 어려움을 느꼈고, 성적으로 증명이 되었습니다.. 허허.. 😥 방통대를 다녀보니.. 회사와 대학을 병행하는게 보통 독한게 아니구나 싶고, 과제 전까진 매일 1강씩 어떻게든 들었지만 과제를 하면서 강의 대신 과제에 매달려 제 루틴이 깨지고 과제 제출 이후에 루틴이 돌아오지 못해.. 결국.. 기말고사는 타노스 공부법으로 6과목중 3과목만 살리기로 타협을 보게 되었습니다.. 그래도 강의의 퀄리티는 높고, 잘 듣고 문제만 잘 풀기만 해도 B는 수월하게 얻을 수 있으니 저처럼 게으르지 않다면 더 좋은 점수를 얻으실 수 있으실겁니다😉

Excelcon 과 인프런 퇴근길 밋업

올해 처음으로 개발자 행사를 참가해봤습니다!

Excelcon

Excelcon은 엑셀플레이스에서 예찬님의 주도하에 이뤄진 개발자 밋업입니다. 저는 당첨되지 못해 표를 따로 구해서 참가했기때문에 따로 세션 참가는 하지 않았고, 네트워킹만 참여했습니다. 이때, 다양한 개발 분야의 사람들과 대화해보면서 정말 내가 아직 많이 부족하고 이렇게 열정 넘치는 사람들이 많구나 하면서 많은 자극을 얻었던 행사였습니다. 그리고 엑셀플레이스 짱 맛있어요. 저때 받은 육포도 너무 맛있어서 주기적으로 인터넷으로 시켜먹습니다..

인프런 퇴근길 meet-up

인프런측에서 처음으로 주최한 meet-up으로 이때 주제는 Node.js였습니다. 역시, Node.js계 1티어 회사(이건 제 개인적인 주관입니다) 인프런답게 Node.js 관련 세션을 준비해주셔서 알차게 듣고 왔습니다. 후기는 인프런 밋-업 후기 여기에 적어뒀습니다 😎

발레🩰

회사에서 운동비가 15만원이나 나와서 반년만에 다시 발레를 시작했습니다! 역시, 발레를 하고나면 개운하고 어깨나 허리도 안 아프고 너무 좋습니다 짱이에옹👍 화, 목마다 운동을 가는데 반년 사이에 왕초보-> 초보 lv.1로 올라갔네요! 올해는 lv.2로 올라가겠죠?!

병원🚑

올해는.. 제 오른다리가 살기 싫은걸까요.. 연초에 염증으로 철보호대를 차고 한달정도 살았는데 여름에 언덕에서 삐어서 깁스하고.. 크리스마스 이브에 침대에서 미끌어져서 정강이 근육이 찢겨 지금도.. 깁스 신세를 지고 있습니다. 이 모든 다리가 전부 오른쪽 다리라는거!!! 이친구.. 수명 괜찮겠죠..? 참 걱정이군요ㅠ

✁- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 2022년은 정말.. 바쁘게 산거 같네요! 회사도 다니고 퇴근하고 운동도 하고 공부도하고 병원도 다니고.. 주말에 야구도 보고.. 롤도 보고.. 시간 나면 오버워치나 롤도 하고.. 뭔가 실속없이 바쁘게 사는 것 같지만 이게 저인걸 어쩌겠습니깧ㅎㅎㅎ 2023년에는 다치지 말고 개발적으로도 한층 더 성장하는 한 해가 되길 바라며 이만!!

어제(11/29) 인프런에서 주관한 11월 인프런 퇴근길 밋-업 #1 Node.js에 다녀와봤습니다😎

인프런은 강의를 수강 했던 경험도 있고, Node.js를 다루는 몇 없는 회사중에서도 유명한 회사라고 생각합니다. 여태 다녀와본 개발 행사가 오프라인으로는 Excelcon, 온라인으론 toss Node.js Meet-up이 전부였었어서 굉장히 설레는 마음으로 다녀왔습니다 :)

순서

18:30 ~ 19:00 체크인 및 샌드위치 먹는 시간 19:00 ~ 19:10 밋업 소개 및 인사 19:10 ~ 19:30 [세션1] 주니어 개발자의 Node.js 코드 변천사 19:30 ~ 19:50 [세션2] Shell we Nest.js? 19:50 ~ 20:10 [세션3] Node.js에서 CPU-Intensive한 코드를 찾아내는 방법 20:10 ~ 20:20 쉬는 시간 20:20 ~ 21:20 Q&A 및 네트워킹 으로 구성되어 있습니다.

1. 밋업 소개 및 인사

인프런의 CTO 이동욱님(향로)께서 인프런에 대한 소개와 백엔드 개발자 모집한다는 말씀을 하셨습니다. 이때 가장 기억에 남는 것은 서비스 규모가 커지면 다들 자바스프링으로 넘어가는데 인프런은 최대한 Node.js를 사용해보고 정말 자바스프링으로 넘어갈 필요성이 있다면 그땐 넘어가겠지만 최대한 Node.js를 사용하겠다는 말씀을 하셨는데 이 말을 듣고 인프런의 앞으로의 개발 행보가 궁금해지게 되었습니다.

2. [세션 1] 주니어 개발자의 Node.js 코드 변천사

연사로 나오신 분은 인프랩에서 렐릿 백엔드를 담당하시는 이소연님께서 발표하셨습니다. 본인의 개발 일대기를 재미있게 그레프로 보여주시면서 이전에 개발했던 코드와 현재 코드를 비교하면서 설명하시는데 같은 주니어 개발자로서 그리고 스타트업에 다니고 있는 사람으로서 굉장히 공감되는 세션이었습니다. 물론, 저는 아직도.. 연사님만큼 코드 변화가 크지 않지만요..ㅎㅎ...

3. [세션 2] Shell we Nest.js?

연사로 나오신 분은 팀스파트타(항해 99)에서 CTO 남병관님께서 발표하셨습니다. 이 세션을 들은 후 저는 강하게 Nest.js에 빠졌고 개인 토이프로젝트는 Nest.js를 사용하기로 결심했습니다 ㅋㅋㅋㅋ 이 세션은 제목에서도 느껴지지만 Nest.js를 설명하고, 왜 팀스파르타는 Flask를 두고 Nest.js로 왔는지를 설명하는 세션이었습니다. 해당 세션은 객체지향어를 모른다면 이해하기엔 조금은 어려울 수 있지만, 객체지향어를 알고 있다면 어렵지 않게 들을 수 있습니다.

Node.js와 서버측 Javascript가 고질적으로 가진 아키텍처에 관한 문제를 해결하기 위해 등장한 Nest.js

팀스파르타는 위 부분의 문장을 보고 당당하게 고질적 문제를 해결하기 위해 나왔다는 Nest.js로 결정하게 되었다고 합니다. 그 뿐만 아니라 Vanila Javascript와 Typescript 모두 호환이 가능한 것도 한 몫했습니다. Nest.js의 기본적인 구조 중 Controllers, Providers, Modules, Pipes에 대한 설명을 하셨습니다. 일단, Nest.js는 보통의 객체지향어가 갖고 있는 비슷한 형식입니다.

Controllers

클라이언트에 응답을 반환하고 Http통신 요청을 처리 하는 부분입니다.

Provides

Nest.js의 기본적인 개념으로 다른 프로바이더나 컨트롤러에 의존성이 주입 가능합니다.

Module

데코레이터가 달린 클래스 입니다.

Pipes

인터페이스 @Injectable()이 데코레이터로 주석이 달린 클래스 입니다.

Nest.js의 기본 설명은 추후 Nest.js 관련 글에 올리겠습니다 ☺

4. [세션 3] Node.js에서 CPU-Intensive한 코드를 찾아내는 방법

연사로 나오신 분은 당근마켓에서 백엔드 개발자로 근무하고 계신 김경덕님께서 발표하셨습니다. 개인적으로 이 세션이 제일 기억에 남고 유익하다고 생각했습니다. 네트워킹때에도 해당 세션을 인상깊게 보셨다는 분들이 많았습니다. 저는 사실 이렇게 트래킹을 파악하는걸 처음 알아서 신기하기도하고 꽤나 도움이 될 것같단 생각을 했습니다. 해당 세션은 Clinic.js에 대한 세션이었습니다. 간단하게 Runtime을 분석하여 어플리케이션의 문제점을 체크하는 모듈입니다. 간단하게 yarn이나 npm install로 다운이 가능한 모듈이며, clinic doctor ~ 명령어를 이용하여 간단하게 리소스 상태들을 확인할 수 있습니다. Clinic.js는 시각적으로 어떤 api 콜이 부하가 걸리는지를 잘 보여주며, 이전에 입사 초 회사 어플이 특정 시간에 트래픽이 몰려 느려졌던걸 파악했던 때가 떠오르면서 해당 모듈을 어떻게 하면 잘 이용할 수 있을지 생각해 볼 수 있었습니다.

위 세션들은 인프런 밋업 세션 동영상 여기서 다시 볼 수 있습니다. 개인적으로 꽤 알차다고 생각했기에 한번쯤 보시는걸 추천 드립니다!

5. QnA

실시간으로 익명성이 보장된 웹페이지에서 QnA를 받았는데요.. 이게 익명성이 보장되다보니까 현장에 있으면서 키보드 워리어 마냥 이런 악의적인 질문은 왜 하는지 모르겠는 질문들이 올라와서 좀 개선할 필요성이 있다고 생각했습니다. 기억에 남는 질문은 npm vs yarn 이었던거 같습니다. 근데.. 좀 오래되서 기억이 잘 안 납니다..

6. 네트워킹

네트워킹이라고 쓰고 조별토론..?라고 읽습니다. 일단, 제가 속한 조는 그랬습니다.. 네트워킹 시간에는 인프런 직원 한 분과 참여자 56명이 한 조로 둥글게 뭉쳐서 오늘 어땠는지 이야기 하는 시간 같았는데 뭔가.. 질문에 답하는 형식으로 진행되서 제가 생각한 네트워킹이랑 많이 다르지 않았나..싶지만.. 시간적 제한이 있어 이렇게 진행된거라고 생각합니다. 아무래도 앞서 QnA시간이 생각보다 길어졌었고, 준비된 네트워킹 시간 자체가 한시간? 정도로 좀 짧았던 터라 정말 자유롭게 명함 교환하고 이런 시간은 아니였습니다!

7. 후기

다음에 Nest.js나 Node.js 등 관련된 밋업을 주최한다면 또 참여할 의사가 있습니다! 일단, 세션을 들으면서 사고의 확장도 가능하고 QnA를 하고, 들으면서도 많은 정보를 얻어가기 때문에 가는 거리가 오래 걸렸어도 유익했습니다.

1. SELECT문 기본 구조

select문 기본 구조는 SELECT 필드명 FROM 테이블 WHERE 조건으로 가장 많이 쓰이는 형태는 아래와 같습니다.

SELECT * FROM 테이블 WHERE 조건 ORDER BY 컬럼 DESC(또는 ASC);

이 형태는 WHERE 절의 조건을 만족하는 테이블의 모든 데이터를 ORDER BY 기준 DESC(내림차순)/ASC(오름차순) 입니다.

2. SELECT 시 같은 데이터 어떻게 처리?

오늘 글의 핵심인 SELECT문 시 여러개의 같은 데이터를 반환하는 경우가 있는데 이때 중복 데이터를 정리하고 싶을 때 어떻게 하는지 알아보겠습니다. 두가지 방법이 있는데 DISTINCT 와 GROUP BY가 있습니다.

2-1) DISTINCT

DISTINCT는 중복값만 제거해 줍니다.

SELECT DISTINCT 필드명 FROM 테이블 WHERE 조건;

이런 형식으로 SELECT 바로 뒤에 위치하여 사용하게 됩니다.

2-2) GROUP BY

GROUP BY도 중복값을 제거하며, DISTINCT와 다른 점은 정렬도 같이 진행합니다.

SELECT 필드명 FROM 테이블 WHERE 조건 GROUP BY 조건;

이런 형식으로 WHERE절 뒷쪽에 위치하게됩니다.

🚨 SQL문은 반드시 SELECT 컬럼명 FROM 테이블명 WHERE 조건 GROUP BY 조건 HAVING 조건 ORDER BY 조건 DESC(또는 ASC) 순으로 작성해야 오류가 발생되지 않습니다.

2-3) DISTINCT VS GROUP BY

위에서 언급했듯 두 개의 차이는 정렬을 해주냐 안 해주냐의 차이가 제일 큽니다. 그렇다면 정렬을 해주는 GROUP BY가 좋은 것이 아니냐! 라고 생각하실 수 있지만, GROUP BY가 DISTINCT보다 수행해야하는 일이 많기 때문에 당연히 성능은 DISTINCT가 좋을 수 밖에 없습니다. 어떤 것에 더 주안점을 두고 쿼리를 작성하느냐에 따라 선택이 달라질 수 있습니다.

단순히 중복값 제거만 한다면 DISTINCT를 사용하는 것을 추천합니다. 하지만, 그 외에 HAVING이라던지 COUNT라던지 GROUP BY를 하여 부수적인 작업을 해야한다면 그땐 당연히 GROUP BY를 하는 것을 추천합니다.

참고 Blog

into MySQL

parseInt(string) 만 적게 되면 위처럼 missing radix parameter 라고 뜨게 됩니다. MDN을 보게 되면 정식 구문은 parseInt(string)/ parseInt(string, radix) 입니다. string은 파싱 할 문자열이며 매개변수가 문자열이 아닌 경우 toString 하여 문자열로 반환하여 사용하게 되는데 공백 제외 첫문자열이 숫자로 변환이 안 될 경우 NaN을 반환합니다. radix는 string의 진수를 나타내며 2~36 사이의 정수입니다. 이때 기본 값은 10이 아닙니다. ECMAScript 3부터 radix 누락을 권장하지 않습니다. radix가 없을 경우 0x 또는 0X로 시작하는 문자열은 16진수로 간주 되며 그 외 문자열은 10진수로 간주하게 됩니다. radix를 명시 해야 해당 진법으로 실행하여 값을 도출해 냅니다.

ESLint에서 이것을 검출하는 것을 원치 않는 다면 .eslintrc.json에 "rules":{radix: ["error", "as-needed"]}을 추가 하면 무조건적으로 에러를 뱉는 것이 아니라 필요에 따라 에러를 뱉게 됩니다. "as-needed" 없이 "rules":{radix: "error"}만 쓰게 되면 radix가 없는 경우 무조건 에러를 뱉게 됩니다.

참고 문헌 MDN parseInt ESLint Radix

1. NFT 쇼핑몰 오픈을 목표로 하는 회사에 node 개발자로 입사하다.

국비에서 2개월?정도 HTML, CSS, JS랑 약간의 node.js를 배우고 바로 자바로 넘어가게 되었는데 이때 저 잠깐 배운 node.js로 취업하게 될줄 꿈에도 몰랐습니다만.. 어쩌다 노드 개발자로 입성하게 되었습니다. 이때는 블록체인과 NFT가 막 제 귀에 들려오던 시점에 면접 진행 후 신기술에 혹해 다니게 되었는데요.. 지금와서 생각하면 면접도 너무 허술했고 그 자리에서 합격을 주는 곳이었는데 취준하면서 자존감이 바닥을 친 나머지 회사를 고르지 않고 입사하게 됐네요. 그래도 덕분에 현 회사에 오게 되었지만 되돌아간다면 절대 선택하지 않을겁니다..😂 이때 사수도 없고 정해진 업무도 없이 3주?만에 프로젝트에 투입하게 되었는데 이 당시 저를 너무 폄하해서 혼란스러웠지만 지금 생각하면 그래도 잘 버틴게 다행이라고 생각합니다.

그래서 어떤 일을 하는데?!

우선, 전 회사의 NFT쇼핑몰 프론트 부분과 어드민 프론트 부분, ERC-1155의 다중 전송 부분(백), sms 전송하는 부분(백), 메일 전송하는 부분(백) 정도를 담당했네요. 원래는 어드민 프론트 담당이었지만 여러가지 사정으로 팀장과 저뿐인 개발팀이 되어서 모든걸 맡게 되었습니다..

개발은 JS(Node.js), JQuery 로만 진행했고.. 지금와서 그 코드를 생각하면 수치스러울 정도로 허접합니다..😥 일단 프론트에서 방어를 한다는 것이 말도 안 되는데 그걸 원하셔서.. 그리고 로직도 중구난방으로 분리해둬서 거의 리액트 찾듯 찾아야 하는 수준이 아닐까 라는 생각도 드네요..ㅋㅋㅋ

어떤걸 얻었는데?!

입사 당시 노드 실력은 국비에서 배운 것이 전부이고 app.js 안에 전부 때려박아 작성할 줄만 알았습니다.. 저정도면 사실 노드를 모른다고 봐야하죠. 아예 바닥부터 시작하다보니 모르는 부분도 많고 에러도 많아 우리의 킹갓구글신에게 어떻게 물어보는지, 남이 쓴 코드를 어떻게 추출해서 테스트 하는지 이런 부분을 많이 많이 익히면서 실력도 덩달아 성장한 것 같습니다! 그 외에도 처음으로 남의 문서(NaverSens) 보고 연동 해보고, 짧게나마 ERC-20, 721, 1155가 무엇인지, 1155의 다중 전송은 어떻게 진행할지에 대해 고민하고 공부하게 되어 이더리움에 대해 많은 지식을 얻은 것 같습니다!

2. 이직

이직 계기는 언제나 있었습니다. 위에서 언급했듯 거의 블랙기업에서 근무했기 때문에(흔히 말하는 좋좋소..) 어느정도 경력을 쌓고 나갈 계획이었지만 일단 이력서만 오픈하자 하고 오픈 했고 이게 기회가 되어 중소기업 정도 되는 스타트업에 최종 임원 면접까지 경험도 해보고 물론, 전부 스타트업이었지만 여러 곳에서 이직 제안을 많이 받았었습니다. 중소기업정도 되는 스타트업은 도대체 제가 어쩌다 임원 면접까지 간건지 모르겠지만 이 회사에서 본 손코딩과 기술면접에서 많은 것을 느끼고 내가 많이 부족하구나, IDE에 의지하며 코딩을 했구나 라는 생각을 했었습니다. 정말 저한텐 과분한 기회가 아니였나 싶습니다.

3. 현 회사

지금 회사는 로켓펀치로 먼저 면접 제의를 주셨습니다. 서살 로켓펀치랑 잡코리아, 사람인으로는 꽤 많은 제의를 받았는데 제의 수락 후 면접까지 안 이어졌거나 제가 맞지 않다고 생각하여 거절하기도 했었는데요, 이직 당시 제가 가장 중요하게 생각한 것이 블록체인 업계에 몸을 계속 담구고 싶어 블록체인 위주로 면접을 진행했었습니다. 현 회사도 제 니즈에 부합하여 면접을 보게 되었고 이때 프론트 대신 백엔드 경험을 더 쌓고 싶다고 어필을 하였고 이것을 받아들여주셔서 백엔드 개발자로 입사하게 되었습니다.🌱

입사 후 온보딩 기간을 꽤 넉넉하게 주셔서 1~2달? 정도는 백엔드 구조와 여러가지 미니 프로젝트를 fe 동기분과 함께 협업하여 깃에 올리면 매주 코드리뷰 받는 형식으로 진행했습니다. 코드리뷰를 하면서 코드가 간결해지고 왜 이런식으로 작성했는지 설명하면 다른 방법도 알려주시고 본인 코드에 더 잘 맞는 것을 선택해 적용할 수 있도록 생각의 문을 넓히는 계기가 되었습니다.

그래서 어떤 일을 하는데?!

현 회사에서는 Node.js, MySQL, Vim(아주 조금) 을 이용하여 개발을 하고 있습니다. 주로 회사 어플의 이벤트를 전문으로 담당하고 있고, 요즘은 여러 회사의 api를 받아 붙이는 일을 진행하고 있습니다. 이전 회사에서 NaverSENS로 문자 연동하는 부분을 작성해 봤지만 이건 완전 애교일정도로 실제 업무에서 여러 회사의 API를 붙이는 일 것이 회사마다 문서가 다 다르고, 문서에 없는 부분이라던지 타 회사와 협력하여 진행한다는게 생각보다 복잡한 일이구나를 느끼는 하루입니다. Vim은 puTTY로 젠킨스에 접근하는 일이 종종 있는데 그때 사용하곤 합니다.

회사 외 일상

우선 현 회사 오면서 발레🩰를 다시 시작 했습니다! 저는 거북이🐢가 될 수 없어요. 운동으로 거북이가 되지 않도록 노력할겁니다.

그리고 한국방송통신대학교 3학년 2학기에 편입하게 되었습니다🖋 업무나 면접을 보면서 서버 개발자로서 CS 지식이나 네트워크 지식이 많이 필요하다고 생각하여 공부하는 김에 학위도 따자는 생각으로 편입 신청하게 되었습니다! 딱 2년안에 따고 깔끔하게 다음 회사로 이직하고 싶은 마음입니다.

목표

현 회사에서 커리어를 쌓는 것은 당연하고, 방통대를 유예 없이 졸업하는 것이 목표입니다. 정처기와 SQLD도 따고 코딩테스트를 준비하여 다음 스텝은 대기업 내지 유니콘 스타트업에서 놀아보고 싶습니다.🐋

서버단 연결하기 전 PUG로 간단하게 아임포트를 연결하는 페이지와 에러를 받는 페이지를 만듭니다.

• index.pug

  <!-- jQuery -->
  script(src="https://code.jquery.com/jquery-3.5.1.min.js")
  <!-- iamport.payment.js -->
  script(src="https://cdn.iamport.kr/js/iamport.payment-1.1.7.js")
  

const data = { pg : "#{pg}", pay_method : "#{pay_method}", name : "#{name}", merchant_uid : "#{merchant_uid}", amount : "#{amount}", buyer_name : "#{buyer_name}", buyer_tel : "#{buyer_tel}", buyer_email : "#{buyer_email}", buyer_addr : "#{buyer_addr}", buyer_postcode : "#{buyer_postcode}", notice_url: "#{webhook}" }; const IMP = window.IMP; IMP.init("가맹점 식별코드"); IMP.request_pay(data,(response)=>{ $.post("#{callbackUrl}/API 주소",response, function(res){ ReactNativeWebView.postMessage(JSON.stringify(res)); }); });

- error.pug

script(src="https://code.jquery.com/jquery-3.5.1.min.js")

script(src="https://cdn.iamport.kr/js/iamport.payment-1.1.7.js")

ReactNativeWebView.postMessage(JSON.stringify({result: #{result}}));

pug 기본 문법은 #{}로 데이터를 전달 받을 수 있습니다.
## 아임포트 키
![RESPAPI KEY](https://velog.velcdn.com/images/katherine_12/post/f6d39dc5-baf4-40e1-9f6f-3d30cd80ab07/image.png)
[아임포트 어드민](https://admin.iamport.kr)에 로그인 한 뒤 결제 연동- 우측 상단에 내 식별코드.API Keys에 들어가시면 가맹점 식별코드, REST API KEY, REST API Secret 값을 확인 할 수 있습니다. 
![테스트 연동](https://velog.velcdn.com/images/katherine_12/post/6f06a08d-89fd-433e-bf2a-94c0d14ec7dd/image.png)
또한, 결제 연동 페이지 하단에 보시면 테스트 연동이 있습니다. 설정한 PG사의 정보를 확인 가능합니다.
## 서버작업
- access token
access token은 기본적으로 발행 시간 후 30분동안 유효하며 만료 시간 1분전 요청 시 5분이 더 연장됩니다.

cosnt get_token= async=> { const access_token = await axios({ url: "https://api.iamport.kr/users/getToken", method: "post", headers: { "Content-Type": "application/json" }, data: { imp_key: "REST API KEY", imp_secret: "REST API SECRET" } }); return access_token }

- 아임포트에서 결제 정보 받아오기

const get_imp= async(imp_uid)=> { const access_token= await get_token(); const getPaymentData = await axios({ url:https://api.iamport.kr/payments/${imp_uid}, // imp_uid 전달 method: "get", // GET method headers: { "Authorization": access_token } // 인증 토큰 Authorization header에 추가 }); const paymentData = getPaymentData.data.response;

}

- Router에 연결(302 redirect 받는 라우터와 webhook라우터)

router.post("/iamport", async(req, res)=> { const { success, imp_uid, merchant_uid } = req.body; // 아임포트에서 body로 보내주는 파라미터 // success 가 없을 때 if(success === undefined || success === null){ res.json({result: false}); }else{ try{ const {amount, status} = await get_imp(imp_uid); const [imp_history]= pool.query(SELECT AMOUNT FROM 아임포트 기록 테이블 WHERE merchant_uid= merchant_uid;); // DB에 저장된 기록 가져오기 ... amount 일치하는지 확인 및 status에 맞게 처리 (status- paid(성공), ready(입금 예정, 가상 계좌 발급), failed(잔액 부족 등의 실패) ... return res.json({result: true}); }catch(error){ console.log(error); } }

});

- Webhook Router

router.post("/webhook", async(req, res)=> { const { imp_uid, merchant_uid } = req.body; // 아임포트에서 body로 보내주는 파라미터 try{ const {amount, status} = await get_imp(imp_uid); const [imp_history]= pool.query(SELECT AMOUNT FROM 아임포트 기록 테이블 WHERE merchant_uid= merchant_uid;); // DB에 저장된 기록 가져오기 ... amount 일치하는지 확인 및 status에 맞게 처리 (status- paid(성공), ready(입금 예정, 가상 계좌 발급), failed(잔액 부족 등의 실패) ... return res.json({result: true}); }catch(error){ console.log(error); } }

});

``` webhook과 redirect 시 받는 라우터의 로직은 상당부분 동일합니다. 이 과정을 두번 거치는 이유는 네트워크의 문제로 중간에 유실 될 경우를 방지하고자 webhook 호출하는 것입니다. 그렇다면 redirect용 라우터와 webhook 라우터 순서는 어떻게 될까요? 정답은 순서는 지정되어 있지 않습니다. 하지만 지정을 원하시면 아임포트측에 요청하시면 webhook - redirect 순으로 지정이 가능합니다. 저는 따로 지정하지 않고 진행했으며 DB에 아임포트에서 보내주는 status값을 저장하여 status가 null인경우 로직을 수행하고 아닌 경우 로직을 타지 않고 else문으로 나오도록 처리했습니다.

WEBHOOK

Webhook을 보내기 전 설치할 것이 있습니다. 그건 바로 ngrok입니다. ngrok에서 각 버전에 맞게 다운로드 하신 후 exe파일을 실행하시면 위 이미지처럼 뜨게됩니다. 커멘드에서 ngrok http localhost:3000 치시면 바로 연동이 되며, webhook 호출 테스트가 가능합니다. index.pug에서 로컬에서 webhook 테스트를 할 시에 notice_url에 webhook 커멘드에 떠있는 Forwarding의 주소를 붙인 후 api까지 붙이면 webhook 연동은 끝입니다.(ex.https://${address}.${region}.ngrok.io/API)

API 문서

일반결제 Webhook API 아임포트 javascript-sdk

1. ICONV-LITE란? 짧게 말하자면 인코딩을 도와주는 모듈입니다.

2. ICONV 와 INCOV-LITE의 차이는?

-- ICONV는 모든 문자코드를 변환할 수 있습니다. -- ICONV-LITE는 문자코드를 UTF-8로 변경하거나 UTF-8을 다른 문자로 변환합니다.

추가로 같이 사용하기 좋은 모듈은 jschardet 입니다. 이 모듈은 현재 문자코드가 어떤 인코딩형식으로 되어있는지 알려줍니다.

3. ICONV-LITE 사용법

• npm install npm install iconv-lite
• 적용

  const inconv= require('iconv-lite');
  iconv.decoded("변경할 데이터", "현재 인코딩 형태");

수정

명령어

• 계속 추가 할 예정

합격자 발표 난 당일 등록금을 먼저 납부 하고 시간표를 어떻게 짤지 고민하던 중 다른 학우들이 올려주신 선수과목 가지와 U-Knou 캠퍼스에서 목차를 보고 과목을 선정하게 되었고, 첫 학기에는 바로 언어를 들어가는 것 보다 이론 위주로 듣고 싶어 아래와 같은 시간표가 탄생하게 되었습니다..⭐ 시간표를 짜면서 많은 이들의 글과 학과 오픈 채팅을 통해서 많은 조언을 봤지만, 결국에 사람마다 쉬운 과목과 어려운 과목이 달라서 내가 지금 필요한 과목 or 선수과목 위주로 짜려고 했습니다.

ㅎ ㅏ 곧 16일부터 형성평가 시작이라던데 앱개편과 동시에 학업까지 잘 병행 할 수 있겠지..?

출처 선수과목 이미지- https://blog.naver.com/PostView.naver?blogId=thrmadlsgud&logNo=222419799757&parentCategoryNo=&categoryNo=20&viewDate=&isShowPopularPosts=true&from=search

커멘드에 ngrok http localhost:포트 치면 ERR_NGROK_108 오류 메세지가 뜨는 경우가 있습니다.

이런 경우에는 ngrok.yml 파일을 찾아서 삭제한 후 다시 ngrok http localhost:포트 를 치게 되면 정상 작동 하게 됩니다.

-- 추가 ngrok.yml을 지우고 사용 할 경우 account가 없는 것으로 표시 되는데 이렇게 연동하게 될 경우 webhook 같은 것들이 호출되지 않습니다. 이럴 때 커멘드에 authtoken을 다시 등록합니다. ngrok config add-authtoken 토큰 authtoken 등록 후에도 108 에러가 뜬다면 ngrok을 종료 시킵니다.

• window user tskill /A ngrok
• linux user killall ngrok

종료 시킨 후 재시작을 위해 ngrok stat --all 을 입력 합니다. 재시작 후 다시 ngrok http 포트 입력하시면 정상적으로 작동하게 됩니다.

** 참고 ** ngrok error 108 공식 문서 stackoverflow infinitbility Blog