전체 글

일단 맨땅에 헤딩한 뒤에 배우는 타입입니다
공부!/웹개발

RESTful API

🌱 REST란 무엇일까? REpresentational State Transfer의 약자로, "architectural style for distributed hypermedia systems"라고 한다. 말이 어렵다. 클라이언트와 서버가 resource를 가지고 어떻게 CRUD operation을 하면 좋을지 만들어놓은 가이드라인이라고 이해하면 된다. REST는 3가지 요소로 구성되어 있는데 1. HTTP URI라고 불리는 Resource 2. Verb(get, post, patch, delete) 3. Representation 여기서 리소스란 동영상, 사진, 텍스트 등 HTTP를 통해 제공될 수 있는 모든 것을 의미한다. 🌱 그렇다면 CRUD란 무엇일까? Create, Read, Update, De..

공부!/웹개발

First of Express (유데미 33~34)

express란 node와 javascript를 이용해 웹 서버를 만드는 하나의 프레임워크이다. npm i express를 통해 다운받을 수 있다. 프레임워크와 라이브러리의 차이에 관한 설명이 있었다. 간단히 말하면 필요한 기능들이 도서관에 쫙 깔려있고 사용자가 원할 때 그 기능을 갖다 쓰는 것이 라이브러리이고 짜여진 틀에 따라 우리의 콘텐츠를 끼워넣는 것이 프레임워크란다. 이용자의 자유도에 따른 차이가 큰 듯. express는 req를 읽는 서버를 만들고, 유저의 http request를 우리가 읽기 좋게 Parsing해주고, 우리가 만든 서버의 response를 예쁘게 만들어 Send하고 render하게 해준다. 🌱 EXPRESS APP : REQ, RES express로 웹서버를 실행하고자 할 때 ..

공부!/웹개발

Intro To The Node.js (유데미31~32)

그동안 javascript를 동작시키기 위해선, html의 script 태그에 src="app.js" property를 추가하여 브라우저를 통해 코드를 돌리고, 콘솔창에 뜨는 결과물을 확인했어야 했다. Node.js는 브라우저 없이 javascript 파일을 돌리는 툴이다. 최근 몇 년 들어서 매우 가파른 상승세를 보이고 있다고 한다. (그동안 노드를 몇 번 다룬 적이 있긴 했는데 '브라우저 없이 js를 돌리는 툴'이라는 정의는 처음 배웠다. 신기..) 현재 듣고 있는 강의에서 설명하는 내용 위주로 node.js의 겉핥기 내용을 정리해보도록 하겠다. 🌱 PROCESS 간단히 말하자면 브라우저의 window, python이나 기타 프로그래밍 언어의 sys같은 global object. process.arg..

공부!/웹개발

Axios를 이용한 TV show 이미지 검색!

axios의 기본 사용법은 fetch와 비슷하다. 다만 json형태를 조금 더 간단하게 받고 이용하기 위해 + syntax의 간편함을 이용하기 위해! 사람들이 axios를 조금 더 많이 이용하는 것이다. axios.get(`api_url`, config) 형태로 우리가 원하는 json 데이터를 받아 사용할 수 있으니 간편하지 않나? get을 통해 받은 promise 객체를 통해 .then().catch()를 해도 되지만, 역시 await과 try-catch 블락을 통해 데이터 및 에러 핸들링을 하는 것이 가장 간편한 방법인 것 같다. 유데미에서 예시로 보여준, tv show Web API를 이용하여 어떤 키워드를 검색하고, 그 키워드에 맞는 이미지를 출력하는 사이트를 간단히 만들어보도록 하겠다. api의..

김부추
두들두들