SW

What is Fast API? FastAPI는 타입 힌트(Type hint)를 제공하는 파이썬 웹 프레임워크로 현대적이고 빠른(고성능) 개발을 지원한다. Type hint 알고가기 def foo(a: int) -> int: b: int = 10 return a*b 타입 힌트는 python 3.5 버전 이상에서 사용할 수 있으며, 코드 가독성 향상 및 사용자가 프로그래밍을 할 때 인자 및 변수에 대한 타입을 정의할 때 헷갈리지 않게 도와준다. 위처럼 변수에 타입 힌트를 정의할 수 있으며 언뜻 보면 타입스크립트와 비슷하다. 그러나, 파이썬은 정적 타입을 지향하는 것이 아니다. 타입 힌트는 언어 그대로 힌트를 제공하는 것이며 파이썬은 동적 타입을 지향하는 언어이다. 그래서 인자 a에 정수 값이 아닌 str..

서론 가끔씩 로컬에서 서버를 실행시키고 Front-end, 클라이언트에서 실행시킨 해당 서버에 접근 하려고 할 때 CORS 에러가 발생한다. CORS (Crosss Origin Resource Sharing) 브라우저는 보안상의 이유로 corss-origin http 요청을 거부하는 특징을 가지고 있다. 따라서 이러한 요청을 가능하게 하려면 서버에서 특정 주소를 허락해주어야 한다. CORS는 직역하면 교차 출처 리소스 공유로 표현할 수 있는데 쉽게 설명하면 브라우저에서 다른 출처의 리소스를 공유하는 방법을 말한다. 그래서 이번 글에서는 Django에서 CORS 에러를 해결하는 방법을 다뤄보고자 한다. STEP 1 CORS 에러 해결에 필요한 모듈을 설치한다. pip install django-cors-h..

미들웨어(MiddleWare)? 미들웨어는 양 쪽을 연결하여 데이터를 주고 받을 수 있도록 중간에서 매개 역할을 하는 소프트웨어, 네트워크를 통해서 연결된 여러 개의 컴퓨터에 있는 많은 프로세스들에게 어떤 서비스를 사용할 수 있도록 연결해 주는 소프트웨어를 말한다. 쉽게 생각하면 미들웨어는 클라이언트로부터 요청이 오고, 해당 요청을 다시 응답으로 보내기 위해 목적에 맞게 작성된 함수들의 연속이라고 생각할 수 있다. app.use() 를 통해서 미들웨어를 정의할 수 있다. 미들웨어는 본인의 함수가 끝나면 next()를 통해서 다음 함수를 호출해야 한다. 미들웨어의 특징 각 미들웨어에 정의된 코드를 실행한다. 다음 미들웨어를 순차적으로 실행한다. res.send() 등의 메서드를 이용하여 클라이언트와 서버간..

Styled Components? styled-components는 CSS in JS를 기반으로 구현된 라이브러리이며, CSS in JS의미는 Javascript 안에 CSS를 작성하는 것이다. styled-components 는 현존하는 CSS in JS 관련 리액트 라이브러리 중에서 가장 인기 있는 라이브러리이다. 이번 포스팅 글에서는 styled-components 사용 예제를 간단하게 다루고자 한다. 먼저, styled-components를 다루기 전에 태그에 스타일을 입히는 기존 방법을 살펴보자. function App() { return ( Hello World! ); } export default App; const styles = { divContainer: { backgroundColor..

들어가며 이번 글에서는 React Hook의 개념과 제공하는 기능들을 간단하게 살펴본다. 따라서 리액트 개발 환경이 구성된 이후를 다루기 때문에 환경 구축이 안 된 분들은 여기를 참고하여 개발에 필요한 세팅을 먼저 하는 것을 권장한다. React Hooks? Hook은 함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 “연동(hook into)“할 수 있게 해주는 함수이다. React Hook은 함수형 컴포넌트를 사용하는 것으로 기존 클래스형 컴포넌트가 가지고 있던 단점들을 보완하고자 등장하게 되었다. 클래스형 컴포넌트의 한계 클래스의 문법의 진입장벽 축소의 어려움 re-load 신뢰성 문제 최신 기술의 적용의 비효율성 React Hook은 함수형 컴포넌트에서 ..

서론 이번 글은 도커를 이용해서 Node.js 서버를 배포하는 예제를 다루고자 한다. 따라서 도커 및 노드가 설치되어 있다는 가정하에 진행되는 글이므로 설치를 하지 않은 분들은 먼저 도커와 노드 설치를 하는 것을 권장한다. Node.js 설치하기 : https://nodejs.org/ko/download/ Docker 설치하기(MacOS) : https://docs.docker.com/desktop/mac/install/ Docker 설치하기(Windows) : https://docs.docker.com/desktop/windows/install/ 개발 환경 세팅하기 먼저 Node.js 서버 코드를 간단하게 구축한다. npm init npm install express --save 필자는 nodejs-d..