본문 바로가기

Web13

[Node.js] API 기본 개념 잡기 (express) node.js의 express 모듈 기본 예제를 살펴보면서 어떤 식으로 구성되는지에 대해 살펴보는 목차 Express express - npm (npmjs.com) express Fast, unopinionated, minimalist web framework. Latest version: 4.18.2, last published: 7 months ago. Start using express in your project by running `npm i express`. There are 71761 other projects in the npm registry using express. www.npmjs.com node.js에서 제공하는 간결한 웹 프레임워 1. Hello world 코드 분석 const .. 2023. 5. 2.
[JavaScript] Node.js 생활코딩 기초 내용 정리(Querystring, 파일 read) 목차 WEB2 (Node.js) Node.js - 1.수업소개 - YouTube 본 글은 유튜브 무료 강의 생활코딩의 내용 중 처음 접하는 내용이나 중요하다고 생각하는 내용에 대해서만 정리 강의의 실습 파트는 직접 코드를 작성하기 때문에 여기서는 생략. ※ templeate literal : 내장된 표현식을 허용하는 문자열 리터럴로 표현식 / 문자열 삽입, 여러 줄 문자열, 문자열 형식화, 문자열 태깅 등 다양한 기능을 제공 var name = 'jonghun'; var stringVal = 'hello my name is ' + name; console.log(stringVal); var name = 'Hojun'; var greeting = 'Hello my name is ${name}'; .. 2023. 4. 28.
[웹 보안] 웹 해킹에 대한 기초 내용 정리 보호되어 있는 글 입니다. 2023. 4. 7.
[CSS] 그리드 예제 연습 CSS를 공부하면서 그리드를 배워봤는데 그리드를 통해서 레이아웃을 짜보는 연습이 필요한 것을 느껴 이를 연습해보고자 함. 목차 그리드 예제 현재 가장 해보고 싶은 건 위 이미지를 보면 제목,카테고리, 작성 글들이 저런 식으로 레이아웃 되어 있는데 기초적인 레이아웃을 구성해보고 실제 웹을 꾸밀 때 적용해보고 싶어 이를 실제로 짜보면서 그리드에 대한 이해도를 높이고자 함. CSS 그리드 5분만에 배우기 (Learn CSS Grid in 5 Minutes) - Web Standard (tistory.com) CSS 그리드 5분만에 배우기 (Learn CSS Grid in 5 Minutes) 이 포스트는 Learn CSS Grid in 5 Minute 를 한글로 번역한 글입니다. CSS 그리드 5분만에 배우기 .. 2023. 3. 16.
[JavaScript] 생활코딩 Web2 내용정리 (함수, 객체, 라이브러리 등) 목차 WEB2 (24~37) WEB2 JavaScript - 24.함수예고 - YouTube 본 글은 유튜브 무료 강의 생활코딩의 내용과 검색해서 이해한 내용을 정리하는 글 1. 함수(function) - ★ 1.1. 함수 특정 일을 하는 명령어들의 묶음. → 코드 하나에 이름을 붙여서 반복되는 코드를 줄일 수도 있고 효과적으로 코드 작성 → 관리하기도 용이하고 효율성을 갖는 코드를 만들 수 있음. 1.1.1. 함수의 문법 (fuction, method) 더보기 function two() {} → two라는 함수를 만들고 {}안에 있는걸 실행하겠다는것을 의미뒤에서 two; 만 하면 {}안에 있는 걸 실행 1.2. 매개변수(parameter)와 인자(Argument) - 입력 데이터가 입력이 되면.. 2023. 3. 14.
[JavaScirpt] 생활코딩 Web2 내용정리 (조건문, 반복문) 목차 WEB2 (14~23) WEB2 JavaScript - 14. 조건문 예고 - YouTube 본 글은 유튜브 무료 강의 생활코딩의 내용과 검색을 통해 이해한 것을 정리한 글임을 밝힘. 1. 조건문 하나의 프로그램의 하나의 순서대로 가는 것이 아니라 조건에 따라서 다른 순서의 기능들이 실행되도록 하는 것 if 1.1. 비교연산자, 불리언(자료형) 1 == 1 >>> 좌항과 우항이 같다면 true라는 불리언 값을 가짐 1 == 2 >>> 좌항과 우항이 다르다면 false라는 불리언 값을 가짐. 즉 비교연산자로 좌항과 우항을 비교해서 그 값이 참인지 아닌지에 대한 데이터가 나타남. 1.2. 조건문 더보기 if () {} else {} if 문 뒤에 따라오는 괄호 안에는 불리언 데이터 타입이 .. 2023. 3. 13.
[JavaScript] 생활코딩 Web2 내용정리 (JavaScript-기초) 목차 WEB2 (1~13) WEB2 JavaScript - 1.수업소개 - YouTube 본 글은 유튜브 무료 강의 생활코딩의 내용과 검색을 통해 이해한 것을 정리한 글임을 밝힘. 1. JavaScript intro. HTML으로 웹을 구성했을 경우 출력된 후 변하지 않음. 이를 JavaScript를 이용해서 사용자와 상호작용할 수 있도록 기능을 추가할 수 있다. 즉 JavaScript가 활용된 것과 상호작용을 하면 HTML문서가 동적으로 변하는 것을 관찰할 수 있음. 1. 1. JavaScript 1.1.1. HTMl과 JavaScript의 차이 예시) html로 1+1을 출력한다고 하면 문서상에서 1+1로 출력 JavaScript는 동적임 1+1을 출력한다고 했을 때 2로 출력 1.1.2. .. 2023. 3. 10.
[CSS] 티스토리 블로그 제목 폰트 바꾸기 블로그 제목 폰트가 마음에 들지 않아 이번에 배운 CSS를 통해 변경을 해 볼려고 함. 구글 폰트에서 나눔고딕 폰트를 import하는 코드를 CSS에 추가 Browse Fonts - Google Fonts CSS에서 H1 태그 선택자에서 font-family:Nanum Gothic;으로 변경 Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com CSS를 실제로 적용하면서 이상해지면 어쩌지 걱정이 계속 있었지만 잘 맞아들어가니 다행이다라고 생각함. 2023. 3. 9.