모카스터디/ETC 개발 지식 14

API vs Library vs Framework

API(Application Programming Interface) 응용 프로그램에서 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스 ex) 로그인 요청시 JWT토큰을 넘겨주는 API,새로고침 시 게시글의 정보를 넘겨주는 API 특징 1. 다른 프로그램과 연결 해주는 다리 역활을 한다. 2.구현이 아닌 제어를 담당한다. 3.API를 조합해 원하는 프로그램을 만들 수도 있다 라이브러리(Library) 응용 프로그램 개발을 위해 필요한 기능(함수)를 모아 놓은 소프트웨어 (간단히 말해 문 손잡이, 전화기, 지붕과 같은 집을 지을때 필요한 재료 정도로 생각하면 된다.) ex) passport. react, ... 특징 1. 개발하는 데 필요한 것들을 모아둔 일종의 저장소 2.필요..

Docker란? [파이썬 가상환경 vs 도커 컨테이너]

우선 참빛 설계의 사회적 약자를 위한 '음성인식 키오스크'를 주제로 UMC2기 Node 서버 팀원들과 프로젝트를 하던 중 필요성을 느꼈다.그래서 Docker가 무엇인지 간단하게 알아 보자 ! 프론트와 백엔드에서 노드 서버 구축 후 ai 라이브러리들을 사용하여 자연어처리를 하기 위해  파이썬으로 flask 서버를 구축 하기로 했다. 파이썬을 사용하기 위해 셋업을 하던 중 결국 개발 환경 문제를 해결 하지 못하였다.파이썬 코드를 플라스크 서버에서 사용하기 위해  파이썬 가상환경 세팅을 통일을 하는 부분에서 문제를 직면하였다. 아나콘다로 배포할 경우 mac사용자가 제작한 환경을 윈도우 사용자에게 공유할 수 없었다.또한 같은 mac 유저 끼리도 pip 버전이 차이가 나면 pip명령어로 설치한 konly, Mec..

Next12 [Data Fetching] (getStaticProps, getStaticPaths, getServerSideProps)

보통 리액트에서는 데이터를 가져올 때 useEffect안에서 가져온다.하지만 Nextjs에서는 다양한 방식이 있다.(useEffect도 가지고 올수 있다.) getStaticProps(ISR)Static Generation으로 빌드(build)할 때 데이터를 불러온다(미리 한번에 만들어줌) getStaticPaths(SSG)Static Generation으로 데이터에 기반하여pre-render시 특정한 동적 라우팅 구현(pages/post/[id].js)  getServerSideProps(SSR)Server Side Rendering으로 요청이 있을 때 데이터를 불러 온다.(계속)  getStaticProps- getStaticProps 함수를 async로 export 하면, 리턴되는 props를 가지..

NextJS란 ? [SSR,CSR,SSG,ISR,Pre-Rendering,Hybrid]

React의 SSR(server side rendering)을 쉽게 구현할 수 있게 도와 주는 간단한 프레임워크이다.리액트로 개발할 때 SPA(single Page Application)을 이용하며 CSR(Client side Rendering)을 하기 때문에좋은 점도 있지만 단점도 있는데 그 부분이 바로 검색엔진 최적화(SEO)이다.CSR을 하면 첫페이지에서 빈 html을 가져와서 JS파일을 해석하여 화면을 구성하기 때문에 포털 검색에 거의 노출 될 일이 없다.하지만 Next.is에서는 Pre-Rendering을 통해서 페이지를 미리 렌더링 하며 완성된 HTML을 가져오기 때문에사용자와 검색 엔진 크롤러에게 바로 렌더링 된 페이지를 전달할 수 있게 된다.리액트에서도 SSR을 지원하지만 구현하기에 굉장히..