Rad Blog

Archive

npm --save와 --save-dev를 사용하는 이유, 뒤에 --production을 사용하는 이유

2022-02-01 web xfrnk2
npm install (plugin) –save란? 패키지(plugin)를 ./node_moduels 디렉터리에 설치하고 ./package.json 파일의 dependencies 항목에 플러그인 정보가 저장 된다. –production 빌드시 해당 플러그인이 포함된다. npm install (plugin) –save-dev란? 패키지(plugin)를 ./node_moduels 디렉터리에 설치하고 ./package.json 파일의 devDependencies 항목에 플러그인 정보가 저장 된다. --production 빌드시 해당 플러그인이 포함되지 않는다. 한 가지 더 다른 점은, devDependencies 의 경우 dependencies 와 다르게 --production으로 빌드 시 해당 플러그인이 포함되지 않는다. --save-dev 의 뒤에 있는 dev라는 단어가 아마 development mode 혹은 development purpose 등을 의미하는 것으로 추정된다. Continue reading

HTML 태그 요약

2020-10-05 web xfrnk2
비전공자를 위한 HTML/CSS를 보고 HTML 파트를 정리했다. 정의나 유래 등 기초적인 내용에 대해서는 언급하지 않는다. 개요 HTML : Hyper Text Markup Language 2020/10/2 기준 태그 수 약 130개 정도 실제 자주 사용되는 태그는 25개 정도 -> 필요할 때 찾고 다 외울 필요는 없다. 빈 태그 내용이 없어서 종료 태그가 필요 없음 화면 표시 등과 다른 용도로 사용되며, 대표적인 경우 브라우저가 직접 화면에 그려줘야 하는 경우다.->대체태그(replacement태그) <br>, <img src=""> 태그와 요소의 차이 <h1>Hello</h1> 태그 : <h1>과 </h1> 요소 : 내용까지 통틀어서 전체 큰 범위에서의 태그의 역할 head : 문서의 기본 설정 및 외부스타일 시트 또는 js파일을 연결하는 것 meta : 문자의 인코딩 방식 지정하는 것 -> meta charset=“UTF-8” 제목과 단락 제목 : heading -> <h1>, <h2> … 단락 : paragraph -> <p> // 자동개행됨. Continue reading

서버 사이드 렌더링(Server Side Rendering: SSR) & 클라이언트 사이드 렌더링(Client Side Rendering: CSR) 정리

2020-09-26 web xfrnk2
최근 용어 ‘서버 사이드 렌더링(Server Side Rendering)‘을 알게 되었는데, 리액트를 공부하며 배우게 된 SPA방식과 관계가 있다고 생각했다. 궁금해서 찾아본 내용(서버 사이드 렌더링((Server Side Rendering))과 클라이언트 사이드 렌더링(Client Side Rendering))을 간단하게 정리해 보았다. Server Side Rendering 전통적인 웹 어플리케이션 렌더링 방식 검색엔진 최적화 용이 서버에서 view를 렌더링해서 가져오므로 view를 보기까지 초기 구동속도가 빠름 HTML에 모든 컨텐츠가 저장되어 있으므로 검색엔진 노출에 문제가 되지 않음 사용자가 처음으로 보는 컨텐츠의 시점을 앞당길 수 있음 사용자 정보를 서버측에서 세션 관리 Client Side Rendering SPA 방식(Single Page Application) HTML을 다운로드 받고, JS를 다운로드 받아서, JS가 동작하면서 데이터만 주고받아서 클라이언트 쪽에서 렌더링 하는 방식 브라우저가 없으므로 HTML만 가져와서는 검색에 나오지 않음. Continue reading