홍준혁

HLOG는 개인프로젝트로 제작한 소프트웨어 정보공유 플렛폼이다. velog 처럼 글을 작성하고 다른사람과 소통하는 블로그다. 다들 개인 프로젝트로 블로그 하나씩은 장만하는거 같아서 나도 한번 만들어보았다. 프론트엔드 개발스택은 - Next.js + React.js - TypeScript - Emotion.js - Redux + Redux-saga - Immer.js ... 프론트엔드 파일 구조 백엔드 개발스택은 - Express.js - TypeScript - Mysql (DB) - Passport (Session login) - TypeOrm ... 을 사용하였다. 백엔드 파일구조 개발하면서 느낀 점. 이번 프로젝트를 진행하면서 느낀점이 굉장히 많은 것 같다. 특히 프로젝트를 배포하는 과정에서 많은 오..

hong-junhyeok.github.io/React_Redux_Typescript_Redux-saga/?fbclid=IwAR0J-yUNKHQX08epLX1G26PsfAeVKKTWUCoo7k2IBwmtDFykr53TgOJ04fc React_Redux_Typescript_Redux-saga hong-junhyeok.github.io 리덕스와 리덕스 사가를 쓸 때 많은 분들이 러닝 커브가 높다, 헷갈린다 하시는 분들이 많길래 (실제로 나도.....) 예제를 보여주는 웹사이트를 만들어보면 어떨까 라는 생각으로 React_Redux_Typescript_Redux-saga를 개발하게 되었다. 개발 환경 깃허브 주소 github.com/Hong-JunHyeok/React_Redux_Typescript_Redux-s..

타입 스크립트는 자바스크립트의 슈퍼셋이다. 타입 스크립트를 사용하면 개발자 입장에서 좋은 코드를 작성할 수 있게 된다. (바보 같은 오류를 방지해준다.) 그래서 리액트에서 타입 스크립트를 사용해보자. 먼저 디렉터리를 만들고 CRA를 해준다. 이렇게 해주면 자동으로 타입 스크립트가 설정된 리액트가 프로젝트가 만들어진다. 기본적으로 만들어진 프로젝트에 App과 index를 남기고 다 지워도 무방하다. - 이렇게 파일 구조를 생성해주자. 그다음에 APP에서 styled-components를 이용해서, import styled, { createGlobalStyle } from 'styled-components'; styled와 createGlobalStyle을 선언해주자. 이렇게 되면 GlobalStyle컴포넌..