SAC21 [새싹x코딩온] 풀스택 개발자 부트캠프 과정 16 주차 2차 팀프로젝트 -1 본 글은 추가 보완 중입니다 프로젝트 설명프로젝트 서비스명: 팀 플로우카테고리: IT 협업 플랫폼작업기간: 25. 02. 10일 ~ 02. 28일 사용기술: Node.js, WebSocket, OAuth, nodemailer, MySQL담당하게 된 역할: 백엔드 이 주제를 결정한 이유? 🤔재택근무와 온라인 협업이 증가함에 따라 효과적인 협업 툴에 대한 수요가 증가 분산된 팀원들이 한 곳에서 소통하고, 작업을 체계적으로 진행할 수 있도록 지원하는 서비스가 필요 기능 확정 기능 확정서비스에서 제공할 핵심 기능을 다음과 같이 확정했습니다.워크스페이스 관리 워크스페이스 생성 및 삭제 초대 기능 (이메일 기반) 권한 관리 (관리자, 멤버 구분)칸반보드 기능 업무 생성, 수정, 삭제 상태 변경 (계획 → 진행중.. 2025. 2. 28. [새싹x코딩온] 풀스택 개발자 부트캠프 과정 13 주차-2 React Redux 상태관리 📌 상태관리! 도대체 뭘까?이전 React에서도 말했던 상태관리! 개념을 다시 집고 넘어가 봅시다!React는 컴포넌트 단위로 UI를 구성합니다 컴포넌트 단위로 UI를 구성하는 이유는 바로 재사용성때문입니다이렇게 컴포넌트는 HTML, CSS, Javascript 로직을 하나의 단위로 묶어 관리할 수있습니다 버튼 하나를 갖고있는 컴포넌트를 만들자면 아래와 같습니다function Button() { return Click Me;} 그렇다면 컴포넌트와 상태관리가 어떤 연관을 갖고있을까?🤔상태는 컴포넌트 내부에서 관리되는 값(데이터) 입니다리액트는 컴포넌트의 상태(값)을 변경하게되면 해당 컴포넌트를 다시 렌더링합니다! import { useState } from 'react';function Counter.. 2025. 2. 13. AWS RDS, S3 AWS 클라우드는 다양한 IT 개발 인프라 서비스를 제공합니다 이번엔 그 서비스들 중 하나인RDS와 S3에 대해 알아보고자 합니다 우선 AWS 서비스란 어떤 서비스인지 다시 한번 알아보겠습니다AWS는 클라우드 컴퓨팅 플랫폼입니다 클라우드 컴퓨팅 플랫폼이 무엇이냐?인터넷을 통해 컴퓨팅 자원을 제공하는 서비스입니다 즉 물리적으로 서버를 구입하고직접 관리를 해야하는 불편함이 없다는게 가장 큰 장점이며 이용자가 늘어남에 따라 쉽게 서버를 확장할 수 있고 갑작스러운 IDC 서비스 장애가 발생해도 다른지역 IDC로 서비스를 변경해 빠르게 대처할 수 있습니다 RDS 이란? 📌AWS에서 제공하는 클라우드기반 관계형 데이터베이스 서비스입니다MySQL, PostgreSQL, MariaDB, SQL Server, Orac.. 2025. 2. 8. [새싹x코딩온] 풀스택 개발자 부트캠프 과정 13 주차-1 TypeScript TypeScript📌타입스크립트는 MS사에서 만든 기존 자바스크립트에서 정적타입 문법을 추가한 개발언어입니다 타입스크립트는 매우 엄격한 정적 타입검사를 제공하는데 자바스크립트는 자료형을 동적타입 지향하기때문에 다른 자료형인 변수의 값도 할당할 수 있어 무결성 측면에서 큰 단점을 갖고 있었습니다 이 단점을 보완하고자 사용하는 것이 바로 타입스크립트입니다 프로젝트의 규모가 커질수록 유지보수성을 향상시켜 효율적으로 유지보수할 수 있는 큰 장점이 있습니다 자바스크립트와 문법적 차이// 자바스크립트 기본 문법const a = 1;const b = true;const c = "banana";const d = [1,2,3];//타입스크립트 문법const a:number = 1;const b:boolean = tr.. 2025. 1. 27. [새싹x코딩온] 풀스택 개발자 부트캠프 과정 12 주차-2 React Router, 상태관리, Context React Router📌리액트 라우터란 주소별로 다른 컴포넌트를 보여주기 위해 사용하는 라이브러리입니다 다양한 환경에서 동작할 수 있도록 여러 종류의 컴포넌트를 제공합니다 BrowserRouterRoutesRouteLinkcreateBrowserRouter등 을 제공합니다BrowserRouter📌HTML5를 지원하는 브라우저의 주소를 감지하고 새로고침을 하지 않아도 새로운 컴포넌트를 렌더링 하는 기능을 담당합니다 URL마다 컴포넌트가 바뀔 때 이때 바뀌는 부분의 최상단에 위치합니다 Routes, Route 📌Routes는 경로가 일치하는 컴포넌트를 렌더링해주도록 경로를 매칭하는 역할을 합니다Route는 어떤 경로 요청을 했을때 구체적으로 어떤 컴포넌트를 렌더링 할지 결정합니다path=.. 2025. 1. 20. [새싹x코딩온] 풀스택 개발자 부트캠프 과정 12 주차-1 React Style, hooks React Hooks📌리액트는 다양한 훅(hook)을 지원하는데 대표적으로 사용되는 훅들은 아래와 같습니다 useState() //상태 관리를 위한 가장 기본적인 훅useRef() //참조(레퍼런스)를 생성하고 관리할 수 있는 훅 (DOM 접근, 변수보존 등으로 사용가능)useEffect() // 컴포넌트가 렌더링 될 때마다 특정 작업을 수행하도록 설정할 수 있는 훅useMemo() // 메모이제이션을 통해 함수의 리턴값을 재사용할 수 있게 해주는 훅useCallback() // 함수를 메모이제이션하여 불필요한 렌더링을 줄이게 해주는 훅useReDUCER() // 복잡한 컴포넌트 상태로직을 리듀서 함수를 통해 관리할 수 있는 훅useContext() // 리액트에서 전역적으로 접근 가능한//데이터나 함.. 2025. 1. 17. 이전 1 2 3 4 다음