728x90

백엔드개발 8

React와 Node.js 방명록 개발(1): 프로젝트 개요 및 환경 설정

프로젝트 개요 및 환경 설정내용 요약이 강의에서는 프로젝트의 전체 개요와 개발 환경 설정을 진행합니다. 방명록 애플리케이션에서 구현할 주요 기능과 사용 기술 스택을 살펴보고, 프로젝트에 필요한 개발 환경을 구축합니다. Node.js와 MySQL을 설치하고 기본 프로젝트를 설정하며, Visual Studio Code와 필수 확장 도구 설치 및 GitHub 리포지토리 설정을 통해 코드 형상관리를 시작합니다.1. 프로젝트 개요 설명프로젝트 목표: 방명록 애플리케이션을 개발하여 글 작성, 글 목록, 상세보기, 수정 및 삭제 기능을 구현합니다.기능 소개:글 작성: 작성자명과 메시지를 입력하고 저장.글 목록: 글 번호, 작성 시간, 제목, 작성자를 보여주는 리스트 페이지.상세보기: 글 내용과 작성자, 작성시간을 보..

React 2024.11.02

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(22)

Cafe24 호스팅 설정 및 Node.js 애플리케이션 배포이번 강의에서는 Cafe24 호스팅을 사용하여 Node.js 애플리케이션을 배포하는 방법과 MySQL 및 서버 설정을 다룹니다. Cafe24는 한국에서 널리 사용되는 웹 호스팅 서비스로, 개발자가 손쉽게 애플리케이션을 배포할 수 있는 플랫폼을 제공합니다.1. Cafe24에서 Node.js 호스팅 준비1.1 호스팅 서비스 가입 및 설정Cafe24 홈페이지에서 호스팅 서비스에 가입합니다.관리자 페이지로 이동하여 웹호스팅 또는 앱 호스팅을 선택합니다.Node.js를 지원하는 호스팅 플랜을 선택합니다.1.2 도메인 연결Cafe24에서 제공하는 기본 도메인 또는 개인 도메인을 연결할 수 있습니다.DNS 설정을 통해 도메인을 애플리케이션에 연결합니다.2. ..

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(18)

게시글 수정 및 삭제 기능 구현: 수정 폼과 삭제 기능 추가이번 강의에서는 React와 Node.js를 사용하여 게시글 수정 및 삭제 기능을 구현하는 방법을 다룹니다. 사용자가 기존 게시글을 수정하거나 삭제할 수 있는 기능을 추가하고, 이를 API를 통해 서버와 통신하여 데이터를 처리합니다.1. 게시글 수정 폼 구현게시글 수정 기능을 구현하기 위해, 사용자가 기존 게시글의 내용을 수정할 수 있는 폼을 구성합니다. 수정 폼은 기존 게시글의 데이터를 불러와 사용자가 수정할 수 있도록 합니다.1.1 게시글 수정 폼 구성// src/components/PostEditForm.jsimport React, { useState, useEffect } from 'react';import axios from 'axios..

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(15)

파일 업로드 기능 구현: Multer를 사용해 파일 업로드 및 MySQL에 경로 저장이번 강의에서는 Multer를 사용해 파일 업로드 기능을 구현하고, 업로드된 파일의 경로를 MySQL에 저장하는 방법을 다룹니다. Multer는 Node.js에서 파일 업로드를 처리하기 위한 미들웨어로, 특히 Express와 함께 많이 사용됩니다.1. Multer 설치 및 설정1.1 Multer 설치파일 업로드를 처리하기 위해 Multer를 설치합니다. 프로젝트의 루트 디렉토리에서 다음 명령어를 실행합니다.npm install multer 2. Multer 설정Multer를 사용하여 파일을 업로드하고, 서버에 저장할 파일 경로를 설정합니다.2.1 서버에 Multer 설정 추가multer 미들웨어를 사용해 파일을 처리하고,..

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(12)

React와 Node.js를 사용한 게시판 웹 애플리케이션 개발 강좌이번 강의에서는 React와 Node.js를 사용하여 게시판 웹 애플리케이션을 개발하는 방법을 배웁니다. 게시판 기능에는 게시글 작성, 조회, 수정, 삭제(CRUD)가 포함되며, React는 프론트엔드, Node.js는 백엔드 역할을 수행합니다. 또한, MySQL을 데이터베이스로 사용하여 게시글 데이터를 저장하고 관리합니다.1. 프로젝트 구성프로젝트는 크게 두 부분으로 나뉩니다:프론트엔드: React로 구성되며, 게시글 리스트, 게시글 작성/수정 폼, 게시글 상세보기 등을 구현합니다.백엔드: Node.js와 Express를 사용하여 API를 만들고, MySQL과 연결해 게시글 데이터를 처리합니다.프로젝트 구조my-app/│├── clie..

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(14)

MySQL과 Node.js 연동: 데이터를 읽고 쓰기 및 CRUD API 구현이번 강의에서는 MySQL을 Node.js와 연결하여 데이터를 읽고 쓰는 방법을 배우고, 이를 기반으로 CRUD API를 구현하는 방법을 다룹니다. Node.js에서 MySQL을 활용해 데이터베이스 작업을 자동화하고, API를 통해 데이터 처리를 효율적으로 수행할 수 있습니다.1. MySQL과 Node.js 연동1.1 MySQL 설치 및 설정MySQL이 설치되어 있지 않다면, **MySQL 공식 웹사이트**에서 다운로드하여 설치합니다. MySQL 설치 후, 데이터베이스와 테이블을 설정합니다.CREATE DATABASE node_mysql_example;USE node_mysql_example;CREATE TABLE users (..

React와 Node.js를 사용한 웹 애플리케이션(게시판) 개발 강좌(11)

RESTful API 개념 이해 및 Express로 간단한 API 만들기이번 강의에서는 RESTful API의 개념과 설계 방법을 배우고, Express.js를 사용하여 간단한 API 엔드포인트를 만드는 방법을 알아보겠습니다. RESTful API는 웹 애플리케이션 간에 데이터를 주고받는 방식으로, 표준화된 구조를 통해 다양한 클라이언트가 API를 쉽게 사용할 수 있게 해줍니다.1. RESTful API 개념**REST(Representational State Transfer)**는 HTTP를 기반으로 클라이언트와 서버 간에 데이터를 주고받는 아키텍처 스타일입니다. RESTful API는 이러한 원칙을 따르는 API로, 각 URL이 리소스(데이터)를 나타내고, HTTP 메서드를 사용해 리소스를 처리합니다..

아토믹데브_5_파이썬과 MSA 기반의 기업용 솔루션 개발 실무

API 설계 및 RESTful 서비스RESTful 서비스는 현대 웹 애플리케이션에서 가장 많이 사용되는 아키텍처 스타일 중 하나로, 클라이언트와 서버 간의 통신을 간결하고 효율적으로 수행할 수 있도록 합니다. 이 섹션에서는 REST API의 개념과 설계 방법을 소개하고, OpenAPI/Swagger를 사용해 API를 문서화하는 방법을 살펴봅니다.1. REST API의 개념과 설계 방법**REST (Representational State Transfer)**는 웹 서비스 설계를 위한 아키텍처 스타일로, 자원(Resource)을 정의하고 자원에 대한 표준적인 HTTP 메서드(GET, POST, PUT, DELETE 등)를 통해 CRUD(Create, Read, Update, Delete) 작업을 수행합니다..

728x90