전체 글(55)
-
Node.js 기본 서버 구축
npm init yarn add express dotenv npm install -g nodemon ts-node .prettierrc trailingComma: "es5" tabWidth: 2 semi: true singleQuote: false index.js import express from "express"; const app = express(); app.listen(3000, () => { console.log("hi"); }); app.get("/", (req, res) => { res.send("hello"); });
2021.12.26 -
회고
여름에 첫번재 기획 ppt를 제출했던 것 같은데 벌써 11월도 반이 갔다니 ㅎㅎ 빠르다. 기술적인 성장도 물론 있었지만 그것보다 자아성찰 + 근본적인 고민을 더 많이 하게 되었던 사이드 프로젝트였다. 😑 두서 없이 그냥 들었던 생각을 나열해보면 이렇다 - 기획자가 시장에 대한 객관성과 제품에 대한 애정을 밸런스있게 유지하는 것이 얼마나 힘든 지 - 특정 기능을 사용자에게 제공하는 N 가지 방법 중 한 개를 고르는게 왜이리 힘든 지 - 내 머리에는 왜 렌더링 기능은 없는 지..... 꼭 프로토타입을 봐야만 했냐..! ㅠㅠ figma로 그리고 react로 만들고.. 두 번씩 일해야만 하는 저사양 머리통... - 아이콘 그리는 건 도대체 왜 재밌는 지... 쓸데없이 시간 많이 들였음 - 믿을 만한 동료를 구하..
2021.11.11 -
[React.js] PureComponent
# Pure하다? “Pure하다” 요 개념이 재미있다고 생각한 게 이 내용을 정리하게 된 계기인데요. React 개발을 하다가 아래와 같은 패턴을 마주하게 된 적이 있으신가요? const Component = ()=>{ const [stateValue, setStateValue] = useState(0); const func1 = (value: number)=>{ return value + 1; } const func2 = ()=>{ return stateValue + 1; } return {func1(stateValue)} {func2()} } 두 개의 함수는 같은 일을 하지만 (물론 호출부는 다르겠죠! func1은 param이 있으니까요) 한 가지 차이점이 있습니다. func1은 출력 결과가 입력 p..
2021.11.10 -
[React.js] Recoil 잘 써보기
사이드 프로젝트를 진행하면서 React 상태관리 라이브러리로 Recoil을 사용했다. 간단명료한 concept와 React 함수형 컴포넌트에 친화적인 부가 기능이 (useState와 동작/사용법이 흡사한 형태의 hook이 제공됨)이 특장점이다. Redux & Redux-saga 조합과 다르게 Recoil은 초기 진입장벽이 거의 없었다. (Redux & Redux-saga ... 아직도 이해 못해서 백로그에 천년만년 묵히고 있는 중 ㅎㅎㅎㅎㅎ) 제공되는 object도 atom, selector 두 가지 뿐이고 값을 읽거나 쓰는 것도 useRecoilState hook을 통해 React state와 동일한 모양새로 구현할 수 있다. React "전용" 상태관리 라이브러리면 말 다했다 ㅎㅎ 그런데 Recoil..
2021.08.05 -
WIP 20210714 Design System
0. Intro 이번에 공모전때문에 처음으로 figma를 써보고 난 뒤 Design System에 대해 진지하게 고민을 하게 됐다. 독창적인 아이디어와 다양한 기능도 중요하지만, 오랜 고민을 통해 정제한 UX가 없다면 무용지물이라는 걸 또 한번 느꼈기 때문이다. 시간을 들이면 당연히 그린 화면은 늘어나기는 하는데... 화면 연결, 화면 내 interaction 요소, 특정 메뉴에 대한 진입경로를 어디에 위치 시키는게 편할 지, 이 메뉴가 필요하기는 할 지, 사용자에게 어느 정보가 더 유효할 지 등등 고민이 무한대로 늘어났다. (화면 연결이 너무 감이 안잡혀서 이미 N시간 들여 그린 화면을 그냥 뺄까 고민했을 정도 ㅋㅋㅋㅋㅋ_ 디자인에 대한 전문성이 떨어지는 내 입장에서 기간 내에 완성할 수 있는 최선은 ..
2021.07.14 -
210710 React Native 환경세팅 for Mac
https://reactnative.dev/docs/environment-setup Setting up the development environment · React Native This page will help you install and build your first React Native app. reactnative.dev 위 가이드 대로 수행하되, react-native-cli설치 및 프로젝트 생성하는 부분만 아래의 명령어로 대체 //구버전 react-native-cli를 설치한경우 제거 고고 npm uninstall -g react-native-cli //나는 typescript template을 쓸것이기 때문에 신버전 cli 설치함 yarn global add @react-native-c..
2021.07.10