Develop Note by J.S.

1. 소개 - Svelte 키워드로 구글링을 하는 경우 Svelte, SvelteKit 두 프레임워크에 대한 내용을 접할 수 있습니다. 일반적으로 Svelte라고 하면 프론트엔드 개발을 위한 오픈소스 프레임워크를 뜻하며, SvelteKit은 Svelte를 베이스로한 SSR 기반 프레임워크를 뜻합니다. - Svelte 공식 문서에서의 설치 가이드는 오직 SvelteKit(SSR) 프레임워크 프로젝트 구축에 대한 내용만을 제공하고 있습니다. Svelte에서는 공식적으로 SvelteKit(SSR)을 권장하는 듯 합니다. - 만일 SvelteKit 프로젝트에 SSR 관련된 코드들이 불필요하여 Svelte 프레임워크만을 사용하고 싶다면, Vite 빌드도구에서 프로젝트를 생성하는 방법이 있습니다. 하지만 Svelt..

1. SEO 과정 1) 크롤링 : 웹 크롤러를 이용하여 웹 페이지 정보를 가져옵니다. 웹 크롤러는 사이트를 방문한 다음 모든 링크를 타고 다니며 새로운 페이지들의 정보를 수집합니다. 텍스트만 읽기 때문에 이미지, 동영상 정보는 읽을 수 없습니다. (alt text요소 추가 필요) 2) 인덱싱 : 웹 크롤러가 수집한 정보를 구글 검색 색인에 저장합니다. 검색엔진에 의해 색인이 완료되면 검색 결과에 노출될 수 있습니다. 3) 랭킹 : 검색엔진은 사용자가 검색하는 키워드를 색인 내에서 가장 일치하는 페이지를 찾아 검색 결과에 노출 시킵니다. 이때 각 검색 엔진의 알고리즘에 따라 페이지들의 순위를 매깁니다. 일반적으로 HTML title, meta description 태그를 사용해야 검색 주제와 콘텐츠에 적합..

웹 브라우저의 렌더링 방식은 SSR, CSR 이 있습니다. 두 방식에 특징 및 장단점에 대한 내용을 정리하였습니다. 1. SSR SSR은 Server Side Rendering의 약자로, 웹 페이지의 내용을 서버에서 모두 구성한 뒤 클라이언트로 보내주는 방식입니다. SSR의 특징은 초기 렌더링이 빠르고 SEO (Search Engine Optimization) 최적화에 대한 장점이 있습니다. 대규모 웹 어플리케이션의 초기 렌더링 속도문제를 SSR로 개선할 수 있습니다. 하지만 추가 페이지를 로드할 경우 서버에 Request를 보내는 Cycle을 반복하여 전환 시 화면 깜빡임 문제, 서버 과부하 문제 및 로드 시간이 소요되는 단점이 있습니다. 2. CSR CSR은 Client Side Rendering의 ..