분류 전체보기 17

[새싹x코딩온] 2차 프로젝트 회고록 (231023 ~ 1110)

1. 프로젝트 개요 2차 프로젝트는 온라인 모임을 통한 미션을 모임별로 공유하고, 성취할 수 있는 서비스를 제공하는 사이트를 구축하는 것이었다. 이번에는 프론트와 백엔드간 코드가 아예 깃 레포지토리부터 분리되어 진행하는 프로젝트였다. 지금까지는 프론트와 백엔드 코드 모두 한 프로젝트에 담겨 진행했기 때문에, 어떻게 진행해야할지 감이 오지 않았다. 다행히 개인사정으로 출석하지 못한 날에 프론트와 백엔드 코드를 분리해 진행하는 Mini-Project를 진행한 사실을 알게되었다. 같은 팀원분들께서 해당 Mini-Project를 진행해주셔서 참고하며 진행할 수 있었다. 크게 요약하면 프론트는 React로 진행했는데, View와 관련된 부분 + 백엔드에서 작성한 API를 호출하는 코드가 담겨져 있었다. 백엔드는 ..

IT/SeSAC 2023.11.16

[새싹x코딩온] Express x socket.io로 간단한 단체 채팅 만들기 (라우터 통해서 값을 전달하기)

2차 프로젝트에 적용은 하지 못했지만, 이번 프로젝트에는 꼭 채팅 기능을 넣고 싶었다. 단순 1:1 채팅이 아닌 소위 '단톡방'이라 불리는 단체 채팅 기능을 개발해야했는데, GPT와 구글링, 공식 문서의 도움을 많이 받으면서 실습을 진행해보았다. Express와 socket.io를 이용해 매우 간단하게 만들어보았다. 먼저 채팅 화면을 담당하는 HTML 파일을 살펴보면 다음과 같다. 1. 클라이언트 [Chat.html] 채팅 보내기 getRandomNumber() 함수는 단체 채팅방을 구현하기 위해서, 방 번호를 min ~ max까지 임의의 난수를 생성하도록 설정했다. 이 부분을 적어줘야 socket.io 라이브러리를 사용할 수 있다. // 기본값 const socket = io(); // localhos..

IT/SeSAC 2023.11.09

[새싹x코딩온] Swaager x Express를 yaml 파일로 분리해서 관리하기 (2차 프로젝트 진행 중)

2차 프로젝트 진행 중에 굉장한 삽질을 했다. 정말 구글링과 ChatGPT만을 이용해 정보 수집만 8시간 정도 했던 것 같다. 1차 프로젝트에서는 API 명세서를 구글 스프레드 시트로 작성해서 관리했는데, 너무 불편했다. 수동으로 하나하나 추가/수정/삭제를 해줘야 했기 때문에 휴먼 에러가 발생할 가능성이 높았다. 이번 2차 프로젝트를 진행하면서는 Swagger라는 API Docs 라이브러리를 사용해보자는 의견이 나왔고, 실제로 적용하는 것 까지는 구글링으로 크게 어렵지는 않았다. 하지만 annotation 지옥이라고 스스로 명명한 현상을 겪고, 파일을 분리해서 적용해보고 싶었는데 여간 쉽지 않았다. 잘 되지 않아 시간을 잡아 먹을 거라고 판단해서, annotation 지옥에 빠질지언정 Swagger는 사..

IT/SeSAC 2023.11.01

[새싹x코딩온] 1차 프로젝트 회고록 (230904 ~ 0922)

1차 프로젝트가 끝난지 거의 1달이 되어간다. 그 동안 글도 꾸준히 쓰다가 글쓰기보다는 머리에 지식/코드를 각인하는 연습을 더 많이 해왔다. 그리고 하루마다 배우는 내용이 워낙 방대해서, X일차로 글을 계속 정리하는 것에 부담감을 가지고 모든 것을 놓았다. 글쓰기를 하면 확실히 많이 기억나긴 하지만, 개인적으로 타자로 치는 블로그 보다는 노트에 적으면서 나만의 방식대로 공부하고 정리하는 것이 훨씬 도움이 되었기에 더더욱 그랬을지도 모르겠다. 1차 프로젝트는 5명이 진행했고, 새싹 스터디 모집을 위한 사이트 제작을 하기로 했다. [새싹 스터디 모집 사이트](https://github.com/1st-team-d/ssac-community) GitHub - 1st-team-d/ssac-community: 새싹..

IT/SeSAC 2023.10.19

[새싹x코딩온] 웹 개발자 부트캠프 과정 11일차 정리 | Process, Thread, Node.js의 특징, Module다루기, 구조 분해 할당

우리는 프로그램을 클릭 하거나 어떤 명령어로 실행한다. 이러한 프로그램을 실행하기 위해서는 대표적으로 프로세스와 스레드가 존재하는데, 오늘 이 부분에 대해서 학습하였다. 1. Process, Thread 프로세스와 스레드는 어려운 개념이라고 생각한다. 다만 프로그래밍을 하기 위해서라면 최소한 개념 정도는 짚고 넘어가는 것이 좋다고 생각한다. 프로세스와 스레드에 관해서 간단하게 정리해보자면, Program : 실행 프로그램이라고 부르듯, 실행할 수 있는 파일 → 코드로 짜놓은 파일 Process : 프로그램을 실제로 실행하기 위해 OS에서 할당하는 작업의 단위 Thread : 프로세스안에 존재하며 프로세스를 돕기 위한 작업의 단위 위 그림을 보면 프로세스안에 스레드가 여러 개 있는 것을 확인할 수 있다. ..

IT/SeSAC 2023.08.22