728x90

웹애플리케이션 4

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

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

React 2024.11.02

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

페이지네이션 기능 구현: 대량의 게시글 처리를 위한 서버 및 클라이언트 페이지네이션이번 강의에서는 대량의 게시글을 효율적으로 처리하기 위한 페이지네이션(pagination) 기능을 구현합니다. 페이지네이션을 사용하면 모든 데이터를 한 번에 로드하지 않고, 페이지 단위로 나누어 클라이언트에 전달할 수 있습니다. 이는 성능을 최적화하고, 사용자 경험을 개선하는 데 매우 유용합니다.1. 페이지네이션 개요페이지네이션은 대량의 데이터를 페이지 단위로 나누어 서버와 클라이언트에서 각각 처리하는 기법입니다.1.1 페이지네이션 흐름클라이언트 요청: 사용자는 페이지 버튼을 클릭하여 원하는 페이지의 데이터를 요청합니다.서버에서 데이터 처리: 서버는 해당 페이지에 해당하는 데이터만 클라이언트에 전달합니다.결과 출력: 클라이..

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

게시글 작성 화면 구현: 게시글 작성 폼 구성 및 서버로 전송하여 저장이번 강의에서는 게시글 작성 화면을 구현하고, 작성된 게시글 데이터를 서버로 전송하여 저장하는 과정을 다룹니다. 사용자는 제목과 내용을 입력할 수 있으며, 작성된 게시글은 서버로 전송되어 데이터베이스에 저장됩니다.1. 게시글 작성 폼 구성게시글을 작성할 수 있는 폼을 구성합니다. 사용자가 제목과 내용을 입력하고, 서버로 전송할 수 있도록 구현합니다.1.1 게시글 작성 폼 UI// src/components/PostForm.jsimport React, { useState } from 'react';import axios from 'axios';function PostForm() { const [title, setTitle] = useS..

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..

728x90