안녕하세요. 지금 강좌를 react18 버전 기준으로 업데이트 하고 있습니다.
대부분의 내용은 유효하나 문제가 있는 부분은 제가 수정해서 업로드하였습니다. 유튜브에서도 라이브로 리뉴얼하고 있는 것 보실 수 있습니다.
현재 1-1~6, 3-1, 3-8, 3-11, 5-7 리뉴얼되었습니다. 나머지 부분은 여전히 유효하니 계속 보셔도 됩니다.
추후 useLayoutEffect 부분 추가 예정입니다.
https://youtube.com/playlist?list=PLcqDmjxt30Rt9wmSlw1u6sBYr-aZmpNB3
유튜브 구독자도 25000명이 다 되어가고, 인프런 수강생도 25000명 넘은 기념으로 유료 강좌로 출시하려 했던 JS 고급 강좌를 무료로 풀었습니다. 노드나 JS 강좌 들으시는 분들은 한 번씩 보시면 좋을 것 같습니다. 이 정도는 알아야 자바스크립트 프로그래머로 일하실 때 도움이 될 겁니다.
인간 JS 엔진 되기라는 컨셉입니다. 더 궁금하신 점 있으면 추가로 영상 올리도록 하겠습니다. 또는 복잡한 코드 순서 궁금하신 분들, 코드 문의도 받습니다.
제가 현장강의에서 시간당 최소 10만원씩 받던 강의였는데... 유튜브 컨텐츠가 너무 없어서 업로드했습니다. ㅠㅠ 컨텐츠 추천도 받고 있습니다. 시간당 10만원씩 지불하셨던 수강생분들께 죄송합니다...
제로초 드림.
https://github.com/ZeroCho/react-webgame/tree/master/react-router
react-router 6 코드를 요청하신 수강생분이 계셔서 코드 업데이트 했습니다.
react-router@5와 많이 달라졌습니다. reach-router와 통합했고, remix라는 react 기반 프레임워크에 쓰기 위해 많이 변경한 것 같습니다.
Switch, render, exact, children, component, useHistory, useRouteMatch 등이 전부 사라졌습니다.
Routes, element, useNavigate 등으로 대체되었습니다.
한 가지 주목할 만한 차이점은 더 이상 class 문법을 지원하지 않는 것입니다. 살짝 꼼수를 써야 class에서 사용할 수 있습니다(아직도 class 쓰는 분이 계신지를 모르겠지만요...)
devServer: {
devMiddleware: { publicPath: '/dist' },
static: { directory: path.resolve(__dirname) },
hot: true
}
4버전에서는 devServer 옵션이 위와 같이 바뀌었습니다. 깃헙 코드 참고하세요.
https://github.com/zerocho/react-webgame
웹게임 리액트 강좌 소스 코드 업데이트 중입니다! webpack과 hot reloading 부분 에러를 많이 말씀해주셔서 그 부분 깃헙 코드 먼저 수정해두었습니다.
리액트17, 웹팩5가 적용되고 react-hot-loader(Hot)은 제거되었습니다. webpack-dev-server도 webpack serve --env development로 바뀌었습니다.
리뉴얼 강좌가 출시되었습니다. 무료 강좌를 들으신 분들은 다음 강좌로 이 강좌를 들으시면 좋습니다. 출시 기념 오픈 할인 중입니다~.
리액트를 배우고 나서 웹 서비스를 만들고 싶으신 분들이 많으실 것입니다.
막상 처음부터 만들기에는 폴더 구조 잡기가 어렵다, CRA같은 것은 너무 많은 것을 자동으로 해주어서 원리를 이해하기 어렵고, Next는 뭔가 자유도가 떨어진다고 생각하시는 분들도 많은 것 같습니다.
그래서 지금 현재 오픈 소스로 간단한 웹 서비스 보일러플레이트를 제작 중입니다.
https://github.com/reactGo/reactGo
여기서 redux(saga, thunk), mobx, typescript 버전 소스 코드를 제공하고 있습니다.
React 강좌 수강생분들께 도움이 되길 바라며, 도움이 되셨다면 star도 한 번 클릭 부탁드립니다!
안녕하세요. 리액트 무료 강좌 수강생 여러분.
추가적으로 React Router 무료 강좌를 준비했습니다.
유튜브 https://www.youtube.com/watch?v=veXqpfcis0A&list=PLcqDmjxt30RtqbStQqk-eYMK8N-1SYIFn&index=64
로 오시면 됩니다.
구독 좋아요도 한 번씩 눌러주세요~~!