항해99

[항해99] 6주차 미니프로젝트 회고

백엔드와의 첫 협업을 경험하는 주차였다. 게시판에서의 CRUD만 기획하고 진행했다. 항해에서는 쉬어가는 주차라고 누누이 이야기했지만, 나에게는 심적으로 굉장히 힘들었던 주차였다. 하차하는 인원들이 너무 많아지면서 정들었던 동기들이 나가게 되면서 마음이 너무 힘들었다. 반 분위기도 어수선해지면서 안그래도 공부만 해도 힘든데 나만 잘해도 힘든 마당에 다른 것들이 전부 신경 쓰이다 보니 다들 한 번쯤은 하차를 고민했던 주차였던 것 같다. 그래도 버팀목이 되어주는 사람들이 있어서 마음을 다잡을 수 있었다. 힘이 되어준 같은 반 동기들에게 너무 감사한 마음이다. 미니 프로젝트는 결국 프론쪽 배포를 못하고 끝마쳤는데 상당히 씁쓸했다. 백엔드 팀원들에게 상당히 미안한 마음도 들었다. 팀원분들은 프론트 인원이 너무 부..

[항해99] 5주차 React 심화 회고

👀TIL 모아보기 더보기 [TIL] 저도 대충하고 싶은 날이 있다구요 리액트 심화 주차 시작 학습 목표 능력 리덕스 미들웨어를 활용할 수 있다. 미들웨어를 활용해 비동기 처리를 할 수 있다. 프론트엔드 성능 최적화에 활용할 수 있는 React hook을 숙지하고 있다. synuns.tistory.com [TIL] 시차 적응 중입니다 알고리즘 문제풀이 programmers / level2 / 올바른괄호 GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. Contribu synuns.tistory.com [TIL] 서로 맞춰가는 건 어려운 거야 📝알고리즘 문제 풀이 programmers / ..

[항해99] 4주차 React 숙련 회고

🎓이번 주차 목표 리덕스를 사용하여 전역상태 관리를 할 수 있다. [세부 목표] 1. redux로 상태 관리하기 2. styled-components로 css-in-js 적용하기 3. react-router-dom으로 router 구현 새롭게 적용하는 라이브러리 : styled-components, redux, react-router-dom [과제] 리덕스로 전역 상태 관리하여 투두리스트 만들기 📝숙련 주차 시험 망가진 코드 해결하기 redux로 전역상태관리하고 있는 투두리스트 리액트 앱을 잘 작동하도록 고쳐보자 ▶시험 해설 글 보러가기 [TIL] 하루가 너무 짧다구요 🥽리액트 입문 주차 시험 🔍시험 문제 살펴보기 1. 레이아웃과 기능은 화면에 보이는대로 2. App.jsx와 App.css 파일만 이용하..

[항해99] 3주차 React 입문 회고

✅투두리스트로 시작하는 리액트 투두리스트 구현 기능 투두리스트 추가 투두리스트 삭제 투두리스트 완료 / 취소 투두리스트 학습 목표 props로 컴포넌트 구성하기 리액트 훅(useState) 다루기 event handler로 이벤트 관리하기 vercel을 이용해 리액트 사이트 배포하기 이번 주차 과제는 투두리스트를 제작하는 것이었는데, 별다른 가이드라인도 없이 리액트를 시작하려니까 다들 많이 어려워하는 분위기였다. 개인적으로는 과제 요구사항으로는 배워가는 게 별로 없을 것 같아서 전부터 적용하고 싶었던 기술들을 적용해봤다. vite, typescript, antd, styled-components를 적용했다가 typescript는 개발 속도에서 시간적 한계를 느꼈고 antd는 커스텀이 너무 어려워서 vit..

[항해99] 2주차 알고리즘 회고

🤼‍♀️언어스터디 프리온보딩 주차에 공부했던 자바스크립트를 이어서 공부할 수 있도록 언어스터디를 시작했다. 진행방식은 각 조에 따라서 자유지만, 필수적으로 스터디를 진행하면서 제출해야할 산출물들이 있다. 교재는 항해에서 받았던 혼자 공부하는 자바스크립트를 사용하고 한 주에 한 챕터씩 진행해서 총 6주간 6개의 챕터의 진도를 나가게 된다. ▶챕터 보기 더보기 Chapter 05 함수 : 코드의 집합! 다양한 형태의 함수를 만들고 사용해보며 매개변수를 다루는 방법을 이해합니다. __05-1 함수의 기본 형태 __05-2 함수 고급 Chapter 06 객체 : 객체의 속성과 메소드를 알아보고, 객체를 생성하고 관리하는 기본 문법을 배웁니다. __06-1 객체의 기본 __06-2 객체의 속성과 메소드 사용하기 ..

[항해99] 버킷리스트에 취소/삭제기능 추가하기

❌버킷리스트 취소 기능 추가하기 서버쪽부터 추가해보자! (app.js) bucket_done과 반대로 작동한다고 생각하면 간단하다 cancel 작업을 해줄 url을 추가한다 ( /bucket/cancel ) 클라이언트 쪽의 num값을bucket_done 과 동일하게 받아온다 db에 존재하는 num값을 가진 데이터의 done값을 0으로 바꿔주는 작업을 하면 된다. # 완료 @app.route("**/bucket/done**", methods=["POST"]) def bucket_done(): num_receive = request.form['num_give'] db.bucket.update_one({'num': int(num_receive)}, {'$set': {**'done': 1**}}) return ..

[항해99] 1주차 미니프로젝트 회고

🎨미니 프로젝트 기획하기 4일 기간동안 진행하는 만큼 간단한 게시판 기능 정도 구현할 수 있을 거라고 생각했다. 주제는 독후감 서비스로 잡았다. 사용자들이 책을 좋아하는 사람들이기 때문에 책 신상품과 베스트셀러를 확인할 수 있고, 사용자가 독후감을 작성하기 쉽게 만들어주고 사용자들과 서로 리뷰를 보며 댓글을 남기며 교류할 수 있도록 기획했다. 🖼와이어프레임 figma로 템플릿 하나 다운 받아서 팀원들 다같이 만들기 시작했다. 놀랍게도 팀원 4명 모두 처음으로 figma를 사용하는 거였는데 전직 디자이너님이셨던 팀원님을 필두로 뚝딱뚝딱 만들었다. 와이어프레임을 잡고 시작하니 만들어야 하는 것들이 확실하게 눈에 보인다. 큰 틀을 팀원들이 잡아 놓으면 내가 각각의 기능적인 디테일을 잡아놓는 역할을 했다. 프론..

Javascript의 특성에 대해서 알아보자

🎨JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 ? 1. 느슨한 타입(loosely typed)의 동적(dynamic) 언어 동적 타입 JavaScript는 느슨한 타입(loosely typed)의 동적(dynamic) 언어입니다. JavaScript의 변수는 어떤 특정 타입과 연결되지 않으며, 모든 타입의 값으로 할당 (및 재할당) 가능합니다. 타입 없이 변수 선언하는 것을 느슨한 타입이라고 하며, 강력한 타입(strong typing)을 사용하는 언어는 타입과 함께 변수를 선언해야만 한다. 타입 없이 변수를 선언한다고해서 타입이 존재하지 않는 것이 아니고 컴퓨터가 해석하고 알아서 타입을 지정해준다고 볼 수 있다. 타입에 따라서 자료형에 맞는 메모리를 지정해주는 과정이 존재하기 ..