Sign in
it dev nodejs nestjs vscode

[NestJS] NestJS 시작 (설치 & 구성요소 맛보기)

이제 드디어 NestJS로 어떻게 백엔드 서버를 만들 수 있는지에 대해 알아보도록 하겠습니다. NestJS는 강력한 typing, interfaces, decorator와 같은 기능을 추가하는 TypeScript를 기반으로 구축됩니다. NestJS는 Angular로부터 강한 영감을 받았고 실제로 Dependency Injection, modules, controller와 같은 대부분의 동일한 기능들을 제공합니다. Angular의 이러한 요소는 확장가능하도록 디자인 되어 개발자들이 NestJS의 기능을 확장하기 위해  자기들의 모듈과 플러그인을 만들 수 있다는 것을 의미합니다. 이번 포스팅에서는 NestJS 공식문서를 참고하여 우리가 앞서 배워왔던 개념들을 실제로 어떻게 적용할 수 있는지, 코드 위주로 살..
wono | discuss |
it dev fe svelte mdn

Svelte 시작하기 - Web 개발 학습하기 | MDN

이 문서에는 Svelte 프레임워크에 대한 빠른 소개를 제공합니다. Svelte가 어떻게 작동하는지, 지금까지 본 나머지 프레임워크 및 도구와 Svelte가 어떻게 다른지 살펴보겠습니다. 그런 다음 개발 환경을 설정하고, 샘플 앱을 만들고, 프로젝트 구조를 이해하고, 로컬에서 실행하고 프로덕션용으로 빌드하는 방법을 배웁니다.
wono | discuss |
it dev spring react

Spring boot와 React 연동하기, 빌드하기

시작하기 전에... 아래 2개 글에 각각 Spring boot 와 React를 설치하고 기본 빌드를 하는 과정을 적어두었다. 이것들을 먼저 보시고 이곳에 오시기를 권장한다. 스프링 부트를 설정 하는 법 : https://ruckus.tistory.com/121 Spring boot 프로젝트 생성하기, 그리고 빌드 해보기 개요 Eclipse로 Spring Boot 프로젝트 생성하는 과정 정리 생성 과정에서의 주요 항목들 정리 환경 IDE : Eclipse JAVA : 11 Spring boot : 4.?? 과정 1. 이클립스에서 Spring tools install marketplace에 들어가서 sts를 검 ruckus.tistory.com 리액트를 Node.js로 빌드하는 법 : https://ruck..
wono | discuss |
it dev spring react

[Spring boot + React] Rest Api 연동하기

구조 기본적으로 Spring 프로젝트 내부에 React가 들어가는 형식의 구조로 구성한다. 프로젝트 구조는 본인 편한 대로 구성해도 무방하다. Spring 프로젝트 생성 spring project 생성은 이곳으로 본인이 선호하는 java 버전과 프로젝트 내용을 선택하여 만들면 된다. frontend를 제외하고 위와 같이 프로젝트가 생성이 된다. React 프로젝트 생성 이제 react 프로젝트를 생성할 건데 위치는 원하는 곳에 넣어주면 된다. 나는 spring 프로젝트의 루트 디렉토리에 생성하였다. npx create-react-app {project name} {project name} 이라고 적은 곳에 원하는 app 이름을 작성하면 된다. proxy 설정 이상태로는 프론트와 백이 서로 다른 포트를 사..
wono | discuss |
it dev spring react

[React] Spring Boot와 React를 연동하여 개발 환경 설정 및 Open API 조회

Back-End는 Spring으로, Front-End는 React 환경으로 개발 환경을 만들어 보도록 하자. 한 프로젝트 내에서 Spring으로 백엔드를 구축하고 React로 프론트엔드를 개발하는 방식은 백엔드와 프론트엔드를 동시에 관리하고 통합하는 편리한 방법이다. 이와 같은 구조를 사용하면 하나의 코드베이스에서 모든 업무를 처리할 수 있으며, 백엔드와 프론트엔드를 동시에 빌드할 수 있어 개발과 배포를 간편하게 관리할 수 있다. 하지만 이러한 구조에도 단점은 존재한다.🤔 React는 정적인 앱으로, 백엔드가 종료되어도 프론트엔드는 여전히 작동할 수 있다. 그러나 이러한 구조에서는 백엔드가 종료되면 프론트엔드도 동시에 종료되므로 전체 시스템의 안정성에 대한 리스크가 있다. 또한, 두 애플리케이션의 빌드가..
wono | discuss |
it dev java spring

스프링부트 개발환경 구성하기 (1) OpenJDK 17 설치

📢 2024년 2월 기준으로 포스팅 내용을 업데이트하였습니다. 이번 포스팅에서 Spring Boot를 이용하여 간단한 게시판 프로젝트를 만들어 보려고 한다. 개발에 필요한 프로그램 설치부터 게시판, 로그인 기능 구현까지 차근차근 단계별 세팅을 진행할 생각이다. 최종 목표는 스프링 부트 개발환경을 이해하고, Rest API 형식으로 게시판 API를 설계하고, 스프링 시큐리티를 사용하여 로그인을 구현하는 것이다. 포스팅 순서는 아래와 같다.OpenJDK 17 설치 (현재 포스팅)STS 4 설치스프링부트 프로젝트 생성메이븐 Local Repository 설정DB 설계와 REST API 설계mybatis 연동과 게시판 목록 조회페이징 (Mybatis에서 Pageable) 동적 정렬처리 시작 전 준비사항이번 포스..
wono | discuss |
it dev nestjs github action

[AWS] Github Action으로 EC2에 Nestjs 자동 배포

기존에 AWS EC2에 Nest 프로젝트를 하나 띄워놨었다. 기존 방식은 저장소를 클론해서 pull을 받고 npm run build로 빌드하는 식. 이런 방식이면 배포 브랜치에 커밋이 추가 될 때마다 해당 EC2 인스턴스에 접속해서 pull을 받고 다시 배포를 해야되는 상황이 생겨 불편함이 야기 될 게 뻔했다. 그래서 CI/CD에 대해서 조사를 하던 중에 github action을 사용해서 간단하게 자동 배포 파이프라인을 구축했다. 방식은 다음과 같은데 내가 로컬 컴퓨터에서 깃허브의 레포지토리로 push를 했을 때 github action이 실행되고 github action에서 EC2에 ssh 접속을 해서 작성해둔 스크립트로 pull을 받고 서버를 다시 재가동하는 방식이다. 일단 당연히 EC2(ubunt..
wono | discuss |
it dev oci

[Oracle Cloud] 단돈 0원! Oracle Cloud로 무료 서버 구축하기

AWS 프리티어의 공포백엔드 개발자로 사이드 프로젝트를 해본 경험이 있다면, 프리티어를 통해 AWS 클라우드를 사용해 본 경험이 한 번쯤은 있을 것이다. AWS에서는 1년 동안 EC2, RDS, S3 등 핵심 제품에 대해 무료 제공을 지원한다. 프리 티어를 사용한다면, 큰 추가 지출 없이 가벼운 서비스를 클라우드 환경에서 운영할 수 있다.그러나 프리티어는 1년이 지난 후부터 자동으로 비용이 지불되며, 프리티어 기간 동안에도 무료가 아닌 서비스를 이용하거나 계정 또는 서버에 접근하기 위한 정보들을 탈취당하는 경우 과금이 청구될 수 있다. (AWS 과금 괴담은 많은 개발자들을 두려움에 떨게 하는 이야기이다.)과금 괴담만이 아니더라도 프리티어 기간이 종료되고 나면 지불 비용이 은근히 쎄다. EC2, RDS만을..
wono | discuss |
it dev oci

오라클 클라우드 프리티어(4) - 무료 VPS 사용

안녕하세요 포스팅 글은 오라클 클라우드 프리티어 연재글로써 이번 글에서는 보안 룰셋 설정과 Linux OS의 Firewall 설정, 서버간 route 허용, Oracle Cloud 사용량 확인에 관한 내용을 확인해보도록 하겠습니다. • 오라클 클라우드 프리티어 연재 첫번째 글 오라클 클라우드 프리티어(1) - 무료 VPS 사용 오라클 클라우드 프리티어 연재 글 중 처음 글로 오라클 클라우드의 개요 및 가입에 대한 내용을
wono | discuss |
it dev kotlin coroutine

코루틴(Coroutine)에 대하여

안녕하세요. Checkout Engineering 팀 안세희입니다. 코루틴에 대해 많이 들어 봤지만 원론적인 의미에서 코루틴을 이해하기는 어렵다고 생각합니다. 언어 수준에서 다양한 라이브러리가 코루틴을 사용할 수 있게 제공하기에 항상 깊은 고려가 필요하진 않지만, 코루틴에 대한 개념을 정확히 알고 있어야 활용도 가능하기에 해당 주제로 글을 작성하고자 합니다. 코루틴(Coroutine) 이란? 코틀린을 통해 코루틴을 처음 접하시는 분들이 많기에 코루틴이 코틀린 언어에 종속적인 기술이라고 생각하는 분들이 많습니다. 그러나 코루틴은 1958년 코루틴 용어가 만들어지고 난 후 어셈블리 프로그램에서부터 적용되었던 개념입니다. C#, Javascript, Python, Go와 같은 고급 프로그래밍 언어에서도 지원하..
wono | comment (1) |