JavaScript

TypeScript 기초

본 게시글은 TypeScript의 공식문서를 기반으로 작성되었습니다. https://www.typescriptlang.org/ko/docs/handbook/typescript-from-scratch.html Documentation - TypeScript for the New Programmer Learn TypeScript from scratch www.typescriptlang.org TypeScript를 왜 쓸까? TypeScript는 간단하게, 자바스크립트에 엄격한 자료형 검사가 추가된 형태라고 생각하면 된다. 왜 굳이 자유로운 언어인 JavaScript에 제약을 걸어 사용하는지 의문이 들 수 있다. 언어가 '자유롭다'라는 것은, 작성하는 사람에 따라 그 형태가 천차만별로 달라진다는 것을 의미한다..

NestJS란

NestJS NestJS는 Node.js기반 server-side application을 만들기 위한 framework이다. TypeScript와 JavaScript를 모두 지원하며, OOP, FP, FRP의 요소를 결합했다는 특징을 가지고 있다. 설치 방법 다음과 같은 명령어를 입력하여 NestJS를 설치할 수 있다. $ npm i -g @nestjs/cli $ nest new project-name `npm i -g @nestjs/cli`를 통해 NestJS를 설치하고, `nest new project-name`을 통해 project-name을 폴더 명으로 하는 NestJS 기반 프로젝트를 생성할 수 있다. NestJS의 구조 Controller NestJS를 활용하여 프로젝트를 만들면 Control..

API란? + RESTful API

API API란 애플리케이션 프로그래밍 인터페이스(Application Programming Interface)로, 다른 소프트웨어 시스템과 통신하기 위해 따라야 하는 규칙을 정의한다. 사실 이러한 정의가 크게 와 닿지 않을 수 있는데, 우리가 크롬을 켜서, naver.com을 입력하여 네이버로 이동하는 것 또한 API 요청의 일종이다. 우리가 naver.com을 입력하면, 크롬이 서버에 해당 주소에 해당하는 데이터를 리턴해달라는 요청을 보내고 해당하는 데이터를 리턴 받아 우리의 컴퓨터 화면에 네이버 메인 화면 페이지가 나타나는 것이다. REST REST란 Representational State Tranfer을 뜻하며, API 작동 방식에 대한 조건을 부과하는 소프트웨어 아키텍처이다. REST는 통신을..

(Node.js) Express에서 cookie, session 사용 방법

사용자 로그인 구현 방식의 종류 사용자 로그인을 구현하는 방법에는 `세션과 쿠키`, `Token`, `OAuth` 등 다양한 방법이 있다. 이 게시글에서는 그 중 `세션과 쿠키`를 사용하는 방식을 활용하여 로그인 구현 과정을 설명하고자 한다. 쿠키란? 쿠키는 웹 브라우저에 저장되는 데이터로 클라이언트와 서버 간 상태를 유지하고 정보를 교환하는데 사용된다. 클라이언트 컴퓨터에 저장되며, 해당하는 도메인의 웹 사이트로 통신할 때마다 서버로 전송된다. 쿠키는 `Session Cookie`와 `Permanent Cookie`로 나뉘는데, Session Cookie는 웹 브라우저가 종료될 때 자동으로 삭제되며 Permanent 쿠키는 반대로 계속해서 유지되는 데이터에 해당한다. `Key-Value` 형태의 데이터..

ES class와 prototype

ES class ES class란 JavaScript에서 객체 지향 프로그래밍을 구현하기 위해 정의된 문법적 구조를 의미한다. class Car{ constructor(brand){ this.brand = brand } move(){ console.log("moving"); } } c++등의 객체 지향 언어와 유사하게, constructor를 정의하여 object 생성 시 초기화 작업을 수행하도록 할 수 있다. 또한 다음과 같이 상속을 구현 할 수 있다. class Car{ constructor(brand){ this.brand = brand; } move(){ console.log("moving"); } } class ElectricCar extends Car{ constructor(brand, bat..

(JavaScript) Fetch API

Fetch API Fetch API는 HTTP 파이프라인을 구성하는 요청과 응답 등의 요소를 JavaScript에서 접근하고 조작할 수 있는 인터페이스를 제공한다. Fetch API가 제공하는 fetch() 함수를 활용하여 네트워크 리소스를 쉽게 비동기적으로 취득할 수 있다. 기본적인 리소스 취득 요청은 다음과 같다. async function logJSONData() { const response = await fetch("http://example.com/movies.json"); const jsonData = await response.json(); console.log(jsonData); } 위 소스는 입력된 네트워크를 통해 JSON 파일을 취득하여 콘솔에 출력한다. 가장 단순하게 호출한 fetc..

MySQL 개념

MySQL이란? MySQL은 오픈 소스 관계형 데이터베이스 관리 시스템(RDBMS)이다. 데이터를 테이블 형태로 구조화하여 저장하며, 테이블은 행과 열로 이루어져 있다. SQL(Structured Query Language)을 사용하여 데이터를 조작하며 데이터를 조작하는 등 다양한 기능을 수행할 수 있다. 트랜잭션 DBMS가 제공하는 가장 강력한 기능 중 하나로, 데이터베이스에서 수행되는 하나의 논리적인 작업 또는 단위를 나타내는 개념이다. 트랜잭션은 다음과 같은 특성을 만족시켜야한다. 원자성 트랜잭션은 반드시 atomic해야한다. 이는 트랜잭션이 데이터베이스에 모든 변경 사항을 반영하거나 아무것도 반영하지 않는 두 상태 중 하나만 가질 수 있음을 의미한다. 즉 일련의 과정 중 단 하나만 실패해도 트랜잭..

Express란?

Express Express는 nodeJS를 활용하여 REST 서버를 구현하게 해주는 프레임워크에 해당한다. 사용 방법 가장 단순하게 html을 통해 서버 렌더링을 하는 코드는 다음과 같다. const express = require('express'); const app = express(); const port = 3000; app.get('/', (req, res) => { res.render("렌더링 할 html의 경로") }); app.listen(port, () => { console.log(`server is listening at port:${port}`); }); 우선 다음코드는 Express application을 생성한다. const express = require('express')..