etc3 VSC에서 react사용시 html태그 자동완성 설정하기! 리액트를 사용하면서 매번 이렇게 태그를 만들어줘야했다. 태그를 한페이지에만 수십개 쓰는 경우도 있기 때문에 이 과정이 너무 귀찮아서 구글링을 해보니, vsc에서 지원해주는 플러그인으로 html파일에서는 h1, div 이런식으로만 작성해도 태그가 자동완성이 되지만, react에서는 따로 설정을 해줘야했다. 진짜 간단하다. vsc창 왼쪽 하단에 설정 아이콘을 누른 후, setting을 누른다. 오른쪽 상단의 open setting을 누르면 json파일이 띄워진다. 밑에 코드만 추가해주면 셋팅 끝!"emmet.includeLanguages": { "javascript": "javascriptreact" } 이제는 react에서도 div라 치고 엔터를 누르면 태그가 자동으로 만들어진다! 2022. 1. 24. CSR은 뭐고 SSR은 뭘까? CSR(Client Side Rendering) 클라이언트에서 렌더링 하는 방식 SPA(Single Page Application)와 세트 작동 방식 브라우저에서 서비스에 접속하면, 서버에 요청을 한다. 서버에서 비어있는 html에 js를 포함시켜서 보내준다. 비어있는 html을 받았기 때문에 여전히 빈페이지이고, js링크를 확인후, 다시 서버에 js를 요청한다. 서버에서 js, 라이브러리, 모듈등 모든파일을 번들링한 파일을 브라우저로 전해준다. 유저는 이제 브라우저에서 화면이 보이게 된다. (바로 동적으로 작동) 👉 장점 페이지 렌더링 속도가 빠르다. ⇒ 어떤 페이지를 불러오거나 부분적인 리렌더링이 필요할 때, 그 부분만 렌더링 되기 때문에 SSR보다 빠르다. 화면 깜박임이 없다. ⇒ 요청마다 html.. 2021. 12. 13. VSCode에 자동완성 만들기(snippets) vscode로 블로그 글을 작성하면서, 중복하여 사용하는 내용이 있었다. 이 부분을 snippets 기능을 사용하여 귀찮음을 덜 수 있었다. 나의 경우는 블로그 글을 작성할 때, 혹시라도 틀린 내용이 있을까봐 아래와 같은 문장을 항상 상단에 작성하였다. 현재 개발공부중이며, 해당 글에 틀린 내용이 있을 수 있습니다. 부족한 부분에 대해서 피드백을 주시면 수정하겠습니다. 매번 작성하기 너무 귀찮아서 방법을 찾아 보았고, vsc기능에 snippets를 만드는 기능이 있었다. snippets 만드는 방법 vsc하단 왼쪽에 보면 설정 아이콘이 있다. 설정 아이콘에서 user snippets를 선택한다. 선택을 하게 되면 위와 같이 검색창 같은 것이 뜬다. 나는 README에서 사용할 마크다운 snippets이 .. 2021. 11. 5. 이전 1 다음
