개발4 생각해보면 리액트는 인강 하나도 안보고 여러 블로그랑 공식문서 보면서 만들어본게 끝이다. 궁금한게 생기거나 하면 검색해서 자료 찾아본거랑 그냥 계속 생각한게 다인데 언제 이 정도로 숙련도가 오른건지 내가 어떻게 공부했는지 모르겠다. 요즘은 리액트 관련된 것들 러닝 커브가 한시간 정도 걸리는거 같은데 많이 만들어 보는게 정답인가? 그래서 다른 사람이 어려워 하는게 이해가 잘 안된다. 테스트 주도 개발이나 엔터 프라이즈 아키텍쳐 같은 부분을 좀 더 잘하고 싶은데 뭘 해야할지 영 감이 안잡히네 2022. 1. 26. [웹챗] 프론트 ENTRY 구성 및 벡엔드 repo 생성 프로젝트 Repo https://github.com/yoonjonglyu/webChat GitHub - yoonjonglyu/webChat: 간단한 채팅 웹 간단한 채팅 웹. Contribute to yoonjonglyu/webChat development by creating an account on GitHub. github.com 기본적인 환경 설정은 끝났고 react와 recoil를 통한 번들링 entry와 앱의 시작점이 될 app entry를 만들어줘야 한다. 크게 거창하게 할 것은 없고 보편적으로 나누는 방법대로 index.tsx와 app.tsx로 나누어서 세팅했다. index.tsx 코드 import React from 'react'; import ReactDOM from 'react-dom.. 2021. 11. 17. [웹챗] 프로젝트 환경설정 프로젝트 Repo https://github.com/yoonjonglyu/webChat GitHub - yoonjonglyu/webChat: 간단한 채팅 웹 간단한 채팅 웹. Contribute to yoonjonglyu/webChat development by creating an account on GitHub. github.com 이번 사이드 프로젝트의 경우 오픈소스 채팅 모듈 개발 및 NPM 배포를 목적으로 하다보니 프론트, 벡엔드 서버가 둘 다 필요하다. 프론트엔드의 경우 기존의 웹팩 템플릿을 만들어 둔게 있어서 그걸 토대로 repo를 만들고 이번 프로젝트에 사용 될 기술스택들의 기본 설정들을 마무리 했다. 설치 완료한 모듈들 목록은 대략 이렇다. 그냥 평범하게 많이 쓰이는 것들로 react, .. 2021. 11. 16. 프론트엔드 설계 및 디자인 패턴 프론트엔드를 혼자 공부하고 개발하면서 개인적으로 효율적이라고 생각하고 만든 구조중 하나입니다. CSR 기준으로 되어 있습니다. # 리액트 & 웹팩 설정 ### 루트 1. root - 패키지 매니저, 깃, 웹팩, 기타 플러그인 설정이 위치한다. 2. build - 웹팩 세부 설정 & 플로그인등 셋팅이 존재한다. 3. public - 정적파일 보통 index.html이 존재한다. 4. src - 개발한 모든 소스가 존재한다. 5. dist - 웹팩을 통해서 빌드된 프로덕트 소스가 존재한다. 6. etc - types, .storybook 등 폴더가 선택적으로 존재한다. ### SRC 1. assets - 정적 리소스, img나 웹폰트등이 존재한다. 경우에 따라서 css나 js 파일도 있을 수 있다. 2. c.. 2021. 6. 28. 이전 1 다음
