IT

URI URI(Uniform Resource Identifier)는 통합 자원 식별자는 특정 리소스를 식별한다. 자원의 위치뿐만 아니라 자원에 대한 고유 식별자로서 URL 의미를 포함한다. URI의 존재는 인터넷으로 요구되는 기본 조건으로 인터넷 프로토콜에 항상 붙어다닌다. 웹 기술에서 사용하는 논리적 또는 물리적 리소스를 식별하는 고유한 문자열 시퀀스다. URI의 하위 개념으로 URL, URN이 있다. Uniform: 리소스를 식별하는 통일된 방식 Resource: 자원, URI로 식별할 수 있는 모든것 자원은 웹 브라우저의 파일만 뜻하는 게 아닌 실시간 교통정보 등 우리가 구분할 수 있는 것은 모든 게 리소스가 된다. Identifier: 다른 항목과 구분하는데 필요한 정보 URI의 구조 scheme..

브라우저(Browser)란? 웹 브라우저는 동기(Synchronous)적으로 (HTML + CSS), Javascript 언어를 해석하여 내용을 화면에 보여주는 응용 소프트웨어이다. 웹 브라우저가 웹 서버에 필요한 리소스를 요청하면 서버는 응답하고 웹 브라우저는 이를 해석한 후 사용자에게 보여준다. 보통 자원은 HTML 문서지만 PDF, 이미지 등 다양한 형태일 수 있다. 웹 브라우저의 종류는 크롬, 네이버 웨일, 파이어폭스, 사파리 등이 대표적이며 매우 다양하다. 서버의 응답은 주소를 통해 요청하는데, 이 주소를 URI(Uniform Resource Identifier)라고 한다. 브라우저의 구조 사용자 인터페이스 사용자가 접근할 수 있는 영역이다. URI를 입력할 수 있는 주소 표시줄, 이전/다음 버..

Protocol 프로토콜(Protocol)은 컴퓨터 내부 또는 컴퓨터 사이의 데이터 교환 방식을 정의하는 규칙 체계이다. 장비간 통신은 교환되는 데이터 형식에 대해 상호 합의를 요구하며, 이런 형식을 정의하는 규칙의 집합을 프로토콜이라 한다. HTTP HTTP는 Hyper Text Transfer Protocol의 두문자어로, HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜이다. 웹에서 이루어지는 모든 데이터 교환의 기초이며, 클라이언트-서버의 프로토콜이기도 하다. 브라우저인 클라이언트에 의해 전송되는 메시지를 요청(request)라고 하며, 서버에서 응답으로 전송되는 메시지를 응답(response)라고 한다. 각각의 개별적인 요청들은 서버로 보내지며, 서버는 요청을 처리하고 응답을 제..

인터넷인터넷(Internet)이라는 단어를 Inter-net으로 나누면, 내부 망 이라는 뜻이다. 인터넷의 사전적 정의는 '컴퓨터들이 연결된 통신망'이다. TCP/IP로 이루어진 네트워크들이 전세계적으로 연결된 네트워크이다. 전 세계에 깔린 광케이블 또는 UTP등으로 직접 연결되며 어느 하나에 의존적이지 않고 분산된 네트워킹 시스템이다. 현재는 와이파이라는 기술이 등장했지만, 과거에는 전화선에 종량제 모뎀 인터넷 선을 연결해 인터넷을 사용했다. 하나 이상의 컴퓨터가 통신하기 위해서는 서로간의 연결이 필요한데, 이러한 연결을 통해 형성된 네트워크가 곧 인터넷이다. 하나의 컴퓨터를 다른 하나의 컴퓨터와 연결하는 것을 시작으로 복잡한 수준의 연결로 확장될 수 있다. 계속 연결되면 네트워크는 무척이나 복잡하게 ..

1. Material UI MUI: The React component library you always wanted MUI provides a simple, customizable, and accessible library of React components. Follow your own design system, or start with Material Design. You will develop React applications faster. mui.com 리액트 기반 UI 라이브러리 중 가장 인기 많음 구글 머테리얼 디자인을 기반으로 제작 타입스크립트, 플로우 타입 모두 지원 2. React Bootstrap React-Bootstrap The most popular front-end framew..

Prettier 설치 VScode > EXTENSIONS > Prettier install Prettier 설정 1. settings.json 설정 VScode > File > Preferences > setting > settings.json "prettier.printWidth": 200, "prettier.tabWidth": 2, "editor.formatOnType": true, "editor.formatOnSave": true, 2. Default Formatter 설정 VScode File > Preferences > setting > "Default Formatter" 검색 > "Prettier - Code formatter" 설정 3. Format on save 설정 VScode File ..

type: subject body footer Type 영어로 쓰되 첫 문자는 대문자로 표기 Feat: 새로운 기능 추가 Fix: 버그 수정 Add: 코드나 테스트, 예제, 문서 등의 추가 생성이 있을 때 사용 !BREAKING CHANGE: 커다란 API 변경의 경우 Comment: 필요한 주석 추가 및 변경 Chore: 빌드 업무 수정, 패키지 매니저 수정 Design: CSS 등 사용자 UI 디자인 변경 Docs: 문서 수정 !HOTFIX: 급하게 치명적인 버그를 고쳐야하는 경우 Move: 코드 이동있을 때 사용 Improve: 향상이 있을 대 사용. 호환성, 성능, 검증 기능, 접근성 등 다양한 것들이 목적이 될 수 있음 Implement: 코드가 추가된 정도보다 더 주목할 구현체를 완성시켰을 때..

Sequelize SQL 작없을 쉽게 할 수 있도록 도와주는 라이브러리 ORM(Object Relational Mapping): 객체와 데이터를 맵핑(1 : 1 짝지음) mySQL 외에도 다른 RDB(Maria, Postgre, SQLite, MSSQL)와도 호환됨 자바스크립트 문법으로 데이터베이스 조작 가능 Sequelize-cli 사용하기 위한 명령어 % npm i express morgan nunjucks sequlize sequelize-cli mysql2 → mysql2는 MySQL DB가 아닌 드라이버(Node.js와 MySQL을 이어주는 역할) % npm i -D nodemon % npx sequelize init → sequelize 구조 생성 MySQL과 Sequelize의 비교 MySQ..

데이터베이스란? 지금까지는 데이터를 서버 메모리에 저장함 → 서버를 재시작하면 데이터도 사라져버림 → 영구적으로 저장할 공간 필요 MySQL 관계형 데이터베이스 사용 데이터베이스: 관련성을 가지며 중복이 없는 데이터들의 집합 DBMS: 데이터베이스를 관리하는 시스템 RDBMS: 관계형 데이터베이스를 관리하는 시스템 서버의 하드 디스크나 SSD 등의 저장 매체에 데이터를 저장 서버 종료 여부와 상관 없이 데이터를 계속 사용할 수 있음 여러 사람이 동시에 접근할 수 있고, 권한을 따로 줄 수 있음 관련 명령어 맥 터미널 기준 brew 통한 MySQL 설치 $ brew install mysql MySQL 서버 시작 $ brew services start mysql MySQL 설정 $ mysql_secure_i..