분류 전체보기45 CSR은 뭐고 SSR은 뭘까? CSR(Client Side Rendering) 클라이언트에서 렌더링 하는 방식 SPA(Single Page Application)와 세트 작동 방식 브라우저에서 서비스에 접속하면, 서버에 요청을 한다. 서버에서 비어있는 html에 js를 포함시켜서 보내준다. 비어있는 html을 받았기 때문에 여전히 빈페이지이고, js링크를 확인후, 다시 서버에 js를 요청한다. 서버에서 js, 라이브러리, 모듈등 모든파일을 번들링한 파일을 브라우저로 전해준다. 유저는 이제 브라우저에서 화면이 보이게 된다. (바로 동적으로 작동) 👉 장점 페이지 렌더링 속도가 빠르다. ⇒ 어떤 페이지를 불러오거나 부분적인 리렌더링이 필요할 때, 그 부분만 렌더링 되기 때문에 SSR보다 빠르다. 화면 깜박임이 없다. ⇒ 요청마다 html.. 2021. 12. 13. git branch 등 명령어 기록 branch 관련 git branch ⇒ 현재 브랜치 상태조회 git branch dev ⇒ dev 브랜치 생성 git checkout dev ⇒ dev 브랜치로 이동 git checkout -b dev ⇒ dev 브랜치를 생성하고 바로 이동 git merge dev ⇒ dev를 마스터에 merge git branch -d dev ⇒ dev 브랜치 삭제 (보통 merge후, 삭제하는것 같음) git log ⇒ git commit 기록 gitk ⇒ branch 관계도를 GUI로 볼 수 있다. ⇒ brew install git-gui 후 사용 가능한 명령어 git init 저장소 생성 git status 코드 상태 보여줌, 수정파일과 add유무 git add add 뒤에 .을 사용하면 모든 수정사항이 저장된.. 2021. 12. 8. React에서 이미지 불러오기(public, src) React에서는 저장된 이미지가 public폴더에있는지 src폴더안에 있는지에 따라 불러오는 방법이 다르다. public 폴더에 저장할 경우 public > images에 저장되어있는 이미지를 불러오기 위해서는 태그를 사용해주면 된다. 주의 할 점은 public 폴더안의 파일은 ../src/images/main.jpg 이런식으로 경로 설정을 해주면 이미지가 불러와지지 않는다. 위와 같이 public안의 폴더나 파일의 경로로 바로 불러와준다. src 폴더에 저장할 경우 src폴더 안에서 이미지를 불러오기 위해서는 img의 src에 직접 경로를 넣어주지 않고, import해와야지만, 이미지가 불러와진다. 해당 파일이 있는 위치를 상대경로로 import해오고 img의 src값으로 넣어주면 이미지가 불러와진다... 2021. 12. 6. React 설치 및 간단 사용법 기존에는 webpack과 babel을 하나하나 설정해야했지만, create-react-app이 생기면서 가장 보편적인 패턴으로 react를 빠르게 개발할 수 있게 도와준다. 설치 npx create-react-app [폴더명] 현재 폴더에서 설치하려면 npx create-react-app . npx를 사용하는 이유에 대해서 궁금하다면 클릭 실행 및 빌드하기 설치를 한 후에 npm start를 하면, script에 있는 start가 실행되면서 localhost:3000에서 화면이 띄어진다. 이 화면에서 network탭에 들어가보면 사이트의 용량이 나오는데 생각보다 높다. 개발용으로 실행되는 것이기 때문에 압축하지 않았기에 용량이 클 수밖에는 없다. 실제 서비스에서는 용량을 최적화하여야 하기 때문에npm b.. 2021. 12. 1. 이전 1 2 3 4 5 6 7 8 ··· 12 다음