'분류 전체보기' 카테고리의 글 목록 (5 Page)

[React] 웹 렌더링 (SSR , CSR, SSG)

📌 React 2022. 2. 2. 03:32

'웹 렌더링', '서버 사이드 랜더링' ... 이게 도대체 뭘까요? 실무에서 주니어인 제게는 아직 경험이 없지만 웹 개발자로서 전체 아키텍처에 영향을 미칠 의사 결정을 하곤 합니다. 웹 개발자가 하는 가장 핵심적인 결정 중 하나는 애플리케이션에서 로직와 렌더링을 구현하는 것이라고 합니다. 웹 사이트를 구축하는 데는 여러 가지 방법이 있는데요. 그래서 좋은 방법이 뭘까 하면서 고민하게 됩니다. 서버 사이드 렌더링? 많이 들어본 것 같은데... React, Vue를 공부하면서 꼭 들어봤을 말인데요. 이것의 개념을 정리하는겸 웹 렌더링에 대해서도 함께 정리를 해보려고 합니다. '렌더링' 이란? 서버로부터 받은 내용을 브라우저 화면에서 표시하는 것. 렌더링 과정 사용자가 브라우저를 통해 웹 사이트에 접속. 브라..

[티스토리] 오른쪽 스크롤바 없애기

🎸 기타/티스토리 관리 2022. 2. 2. 01:55

티스토리 꾸미기에 빠지다 보니 기술블로그의 본분을 잊은 것 같습니다.. 하지만 또 티스토리 꾸미기 재미있는걸요... 그리고 저 처럼 블로그 꾸미기에 관심이 생긴 분들을 위해 이 글을 바칩니다😁 상단 스크롤바를 만들면서 오른쪽 스크롤바를 제거 하고 싶다면 아래와 같은 코드를 HTML 편집에 CSS에 입력하시면 됩니다. /* 스크롤바 없애기 */ body::-webkit-scrollbar { display: none; }

[React] 코드 스플리팅(Code Splitting)

📌 React 2022. 1. 31. 17:21

A, B, C 로 구성된 싱글 페이지 애플리케이션(SPA)을 개발한다고 가정하였을 때, 사용자가 A 페이지에 방문했다면 B, C 페이지에서 사용하는 컴포넌트 정보는 필요하지 않습니다. 이를 필요로 할때는 B 혹은 C 페이지로 이용하려고 할 때만 필요하게 됩니다. 하지만 리액트 프로젝트에서는 별도로 설정하지 않으면 A, B, C 컴포넌트에 대한 코드가 모두 한 파일에 저장되어 버립니다. 만약 애플리케이션의 규모가 커지면 지금 당장 필요하지 않은 컴포넌트 정보도 모두 불러오면서 파일의 크기가 매우 커져버리겠죠? 그러면 로딩이 오래 걸리고, 사용자의 경험도 안 좋아지며, 트래픽도 많이 나오게 됩니다. 이러한 문제점을 해결해 줄 수 있는 방법은 코드 비동기 로딩입니다. 이 또한 코드 스플리팅 방법 중 하나 입니..

[티스토리] 상단 스크롤바 만들기

🎸 기타/티스토리 관리 2022. 1. 24. 10:03

요즘 티스토리 꾸미는 일에 재미가 들었는데요. 개발하면서 구글링을 하다보면 다른 분들의 블로그를 보게 되는데요. 그때 눈에 들어온게 상단에 보이는 프로그래스바(Progress bar) 였습니다. 스크롤 진행상황이 예쁘게 나오면 좋을 것 같아서 여유가 될 때 넣어보았습니다. 기능을 붙이려면 다음과 같은 작업이 필요합니다. 방법 티스토리 설정에서 html 편집으로 들어가서 html 안에 script를 넣어야 하는데요. /* START : 프로그래스바 */ /* END : 프로그래스바 */ /* 주석 */ 부분을 제외한 script만 태그 안에 넣으면 됩니다.

ABOUT ME

Awesome Soo Awesome Soo

티스토리툴바