본문 바로가기

분류 전체보기

(85)
백엔드 기초: Node.js + Express 기본(3)-node.js express, JSON ✨express를 사용해서 통신해보기!터미널에서npm i express명령어를 입력하여 설치부터 한다.http보다 express의 코드가 간결하고 깔끔하다.포트번호는 의미있는 번호로 정하는 것이 좋다 !각 회사 체계 서비스 번호 등 여러 URL을 설정해보고 웹에 필요한 화면을 send()로 띄워주는 연습!listen() 함수의 위치는 상관없이 잘 구동이 된다. 객체데이터를 하나씩 보내지 않고 모아서 한 번에 보내기 위해 사용 JSON이란?: JavaScript Object Notation객체의 예let person = { name: 'songa', age: 20,} JSON형태로 보내기 연습! 아래와 같은 코드일때,100이나 1000 혹은 그 이상으로 만들긴 어렵다.그래서 나온 방법res.js..
백엔드 기초: Node.js + Express 기본(2)-HTTP method, node.js, npm HTTP method (목적)생성: POST조회: GET수정: PUT(무조건 덮어쓰기) / PATCH삭제: DELETEHEAD, OPTIONS, CONNECT, TRACE (데이터 외 설정하는 메소드)cf. PATCH: 일부 변경된 부분만 수정. ex)my page: 연락처, 이메일, 집주소, 이름=>부분 수정 Node.js는 백엔드에만 쓰이지 않는다! Node.js란?특징: 싱글스레드, 이벤트기반, 논블로킹 I/O요리사로 예를 들면?싱글스레드 => 요리사가 한 명이라 주문이 계속 밀려들어와도 혼자서 어떻게든 쳐내야 함이벤트기반 => 주문이 들어와야만 일을 함(= 주문이 없으면, 일을 하지않음!)논블로킹 I/O => 한 명이 일을 하는데, 요리를 순차적으로❌, 중간중간 비는 시간이 있으면 다른 요리를 함..
백엔드 기초: Node.js + Express 기본(1)-HTTP, REST API, URL method ❄️백엔드 개발자는 API(Application Programming Interface)를 만든다. Interface란?중재/매개체가 되어주는 중간역할GUI(Graphic User Interface): 그래픽을 사용하여 명령을 내리는 방법CLI(Command Line Interface): 명령어를 사용하여 명령을 내리는 방법 REST API와 API?API: 과거 HTTP 형식을 따르지 않고 만든 API2000대 초 HTTP 창시자가 형식을 따르면 효율이 극대화 된다고 하자,✨HTTP 규약을 잘 따른 API인 REST API가 나오게 되었다. HTTP인터넷 상에서 공유/전달하고 싶은 모든 것들은 HTTP 규약을 지켜야 한다. HTTP 프로토콜 템플릿Head통신상태(HTTP status code)응답형태,..
웹 서비스의 이해: 웹 생태계부터 웹 브라우저, 그리고 데이터베이스까지(4)-mariaDB 처음써보기, docker 설치 데이터베이스란?데이터를 통합하여 효율적으로 관리하기 위한 데이터 집합체를 데이터베이스(DB)라고 한다.데이터를 구조화하여 관리함으로써 데이터 중복을 막고, 효율적으로 빠른 데이터 연산을 가능하게 한다. DBMS데이터베이스를 운영하고 관리하기 위한 시스템, 이를 통해 데이터베이스를 사용한다. DBMS종류데이터베이스에 연산을 요청하기 위해 사용되는 주요 명령어는 동일하다. SQL(Structured Query Language)SQL은 데이터베이스에 연산을 요청하기 위해 사용되는 언어로,데이터를 생성, 조회, 수정, 삭제 등과 같은 기능을 수할 할 수 있다. 대표적인 SQL 명령어데이터 삽입: INSERT데이터 조회: SELECT데이터 수정: UPDATE데이터 삭제: DELETEDocker운영체제에 플리케이션..
웹 서비스의 이해: 웹 생태계부터 웹 브라우저, 그리고 데이터베이스까지(3)-node.js 처음써보기, server-router 역할 🛍️쇼핑몰 프로젝트!다음과 같이 메인 페이지를 만들고order list 링크를 누르면 아래의 orderlist 페이지가 나옴!다음과 같은 이미지 파일에 링크를 위한 html 2파일 css 1파일로 작성한다.main.htmlorderlist.htmlmain.css➡️나는 flex로 정렬을 하였는데 강사님은 grid로 정렬했다. (gird에 대해 더 자세히 알아볼 필요있음!) 백엔드 웹 서버의 역할웹 서버(Web Server)는 정적 페이지에 대해 대응한다.동적 페이지에 대한 처리를 직접 처리하지 않고, 웹 어플리케이션 서버에게 전달한다.적정 페이지: 화면의 내용/데이터 등의 변동이 없는 페이지를 말함동적 페이지: 데이터 처리/연산을 통해 화면의 내용, 데이터가 변하는 페이지를 말함 웹 어플리케이션 서버와..
웹 서비스의 이해: 웹 생태계부터 웹 브라우저, 그리고 데이터베이스까지(2)-CSS CSS의 이해Cascading Style Sheets의 약자로, HTML을 꾸며주는 언어이다.문서를 통째로 한 번에 꾸미는것이 아니라, HTML 태그를 하나하나 꾸며준다.HTML에 CSS를 적용하는 3가지 방법인라인(inline): HTML 태그 안에 같이 작성내부 스타일 시트(internal style sheet): HTML 문서 안에 같이 작성외부 스타일 시트(external style sheet): HTML 문서 밖에 작성하고 연결❄️인라인태그안에 style=" 스타일속성: 값 ; "❄️내부 스타일 시트 태그 안에 태그를 사용하여 스타일을 지정함.태그마다 class와 id를 줄 수 있는데css에서 🗝️ class는 .class 🗝️ id는 #id❄️외부 스타일 시트html 태그 파일과 css 파..
웹 서비스의 이해: 웹 생태계부터 웹 브라우저, 그리고 데이터베이스까지(1)-HTML 웹의 이해인터넷(Internet): 전 세계의 모든 컴퓨터를 하나의 통신망 안에서 연결한다는 의미를 가진 International Network의 약자웹(Web): World Wide Web, 인터넷에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 공간 웹의 시작1980년대 스위스 유럽 입자 물리 연구소(CERN)의 컴퓨터과학자 팀 버너스-리에 의해 탄생연구원들 간 신속한 정보교환을 위해 고안됨 웹의 특징정보를 하이퍼텍스트 형식으로 표현하여 링크를 따라 이동해서 다양한 정보/문서들을 연결, 제공한다.웹 페이지가 모여 웹 사이트가 된다. 웹 브라우저(Web browser): 웹 페이지 또는 웹 상의 데이터를 찾거나 읽을 때 사용하는 것웹의 구조클라이언트(Client): 서비스를 이용(요청)하는 컴퓨..
포트폴리오 / 협업 환경 구성(5)-협업툴 Trello🔹가볍고 간단하게 사용가능. GitHub나 여러가지 익스텐션 연결가능. 심플하지만 여러 기능들이있다.자세한 디스크립션사용이 힘들다.(링크나 구글드라이브 연결하여 자세한 요구사항적으면 됨)🔸한국어지원이 되지 않음.Jira🔹심플하지만 Trello보다 에딧에 다양한 기능이 더 많고 자세한 디스크립션이 가능하다.애자일 스크럼의 원리 위주로 녹아든 기능이 많아 편리한 점이 많다.스프린트 중간에는 새로운 스프린트 추가에 대해 경고를 해 준다.🔸업데이트를 자주하는데 새로운 기능이 생기거나, 쓰던 기능이 사라지거나 하는 일이 비일비재하다.Notion🔹Jira보다는 Trello에 가깝지만 칸반보드를 여러가지 형태로 다시 볼 수 있다는 점이 다르다.필터나 정렬 기능이 강력하고 자율성이 높은 툴이다.🔸..