컴퓨터 썸네일형 리스트형 구글 아이콘, 폰트 사용법 [구글 머티리얼 아이콘] https://fonts.google.com/icons?selected=Material+Icons Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com [구글 폰트] https://fonts.google.com/?subset=korean Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com * CDN 추가 위의 싸이트에서 검색한 폰트의 CDN을 head 엘리먼트 내에 입력한다. 브라우저에서의 자바스크립트 Javascript in Browser [HTML에 연결] ~/app/public$ vi index.html HTML 문서의 body 제일 마지막에 넣어준다. ~/app/public$ mkdir script ~/app/public/script$ vi index.js alert("HTML과 JAVASCRIPT가 연결됐습니다!"); [페이지 이동] location.href="/주소"; [localStorage 사용법] // 키에 데이터 쓰기 localStorage.setItem("key", value); // 키로 부터 데이터 읽기 localStorage.getItem("key"); // 키의 데이터 삭제 localStorage.removeItem("key"); // 모든 키의 데이터 삭제 localStorage.clear(); // 저장된 키/.. CSS flexbox CSS flexbox를 이용하면 웹페이지를 이쁘게 꾸밀 수 있다. HTML의 태그와 비슷한 듯 하지만 다르다. flexbox는 결과물은 이쁜데 그 과정이 제대로 알고 보면 쉽지만 제대로 모르고 보면 복잡하고 헷갈린다. 그러니 아래의 내용을 대충 읽지 말고 차근차근 정독하자. 다시 말하지만 쓱 속독해서는 오히려 헷갈릴 것이다. flexbox는 부모 요소인 [flex container]와 다수의 자식 요소인 [flex items]로 구성된다. 자식요소1 자식요소2 자식요소3 결국 [flex container]와 [flex items]에 각각 합당한 속성을 부여해 이쁜 결과를 만드는 것이 flexbox를 활용하는 방법이다. 속성 값 container display, flex-flow(flex-direction.. NodeJS multer ▩ 개요 로컬에 있는 파일을 웹서버에 업로드하는 방법을 알아보자. 이때 필요한 미들웨어가 「multer」 이다. ▩ 설치 app$ npm install multer --save ▩ 모듈 추가 const MULTER = require("multer"); ▩ 설정 ◎ 확장자 없이 파일명 자동 설정 const upload = multer({dest: "uploads/", 옵션}); 옵션 내용 dest 또는 storage 파일이 저장될 위치 fileFilter 어떤 파일을 허용할 지 제어하는 함수 limits 업로드 될 데이터의 한도 preservePath 파일의 base name 대신 보존할 파일의 전체 경로 ◎ 확장자와 파일명을 직접 설정 const PATH = require("path"); const ST.. 019. EJS [설치] ~/app$ npm install ejs [문자열 랜더링] [변수 랜더링] [HTTML 랜더링] [다른 EJS 랜더링] //서버에서 전달 돼 온 data [if] [switch] blah4 blah5 [for] 이전 1 ··· 42 43 44 45 46 47 48 ··· 88 다음
