바닐라 js SPA 스타터킷

https://github.com/donghyun1998/vanilla_js_SPA_starter_kit

GitHub - donghyun1998/vanilla_js_SPA_starter_kit: 바닐라 js로 SPA 구현하기 위한 스타터킷

바퀴의 재발명이긴 하지만 많이 배울 수 있는 시간이었다.

component 분할, useState 활용하는 예시 페이지 만들어 두었으니 자바스크립트 잘하시는 분은 그냥 코드 보시면 됩니다.

초심자 분들은 아래 설명 봐주세유

 

router 관련 부분은 https://nukw0n-dev.tistory.com/34

Vanilla Javascript로 간단한 SPA 라우터 구현해보기

이 블로그 참조(꺼억)했다. 관련 포스팅 중에 goat 셨다.

자스 문법공부하면서 하나도 모를 때 많은 도움이 되었다. 

useState 관련 부분은 내 전 포스팅을 참조 바란다. https://donghyk2.tistory.com/144

useState 구현

앞으로 또 바뀔 수도 있으므로...

 

importCss()의 경우 동적으로 css파일 import 해 오기 위해 구현했다.

그냥 무적권 Import 시켜버리면 똑같은 link태그가 추가되므로 비효율적이다.

 

이외에도 함수화 시켜놓은 게 많지만 기본에 충실하기 위해 다 지우고 올린다.

 

+3/29일)

리액트 딥다이브 스터디를 하다가 함수형 컴포넌트의 구조가 내가 생각한 것이랑 완전 다르단 걸 깨달았다 ㅋㅋ.

내가 만든 이 스타터킷은 그냥 클래스형컴포넌트 + useState 억지로 사용하기 였던것이다 흑흑

뭐 그래도 이거 하면서 SPA, 리액트 재렌더링에 대한 이해가 깊어졌으니 좋은 시행착오였다.