분류 전체보기 (92) 썸네일형 리스트형 React, 1일차 create-react-app을 사용하여 앱을 생성 후 기본 디렉토리 및 파일 확인 public 디렉토리 브라우저에서 직접 액세스 할 수 있는 파일들이 포함 index.html: 웹 애플리케이션의 진입점 src 디렉토리 애플리케이션의 소스 코드를 포함 index.js: React 앱의 진입점 파일. ReactDOM.render를 호출하여 React 컴포넌트르 DOM에 렌더링 App.js: 기본적인 앱 컴포넌트가 정의된 파일. 앱의 기본 구조와 레이아웃을 정의 App.css : App 컴포넌트에 적용되는 CSS 스타일을 정의 문제 App.css에 아래와 같이 style을 설정하고 App.js에 적용해보자 이름: .black-box 속성: ba.. pj, 8일차 Mongoose - Node.js와 MongoDB를 위한 ODM(Object Data Mapping) 라이브러리 - Javascript Object와 MongoDB의 데이터를 Mapping하여 호환성을 만들어내고, 간편한 CRUD를 가능 npm i mongoose // db/database.jsimport { config } from '../config.js';import Mongoose from 'mongoose';export async function connectDB(){ return Mongoose.connect(config.db.host);}export function useVirtualId(schema){ schema.virtual('id').get(function(){ .. pj, 7일차 Sequelize - node.js.에서 mysql 등 RDBMS를 쉽게 다룰 수 있도록 도와주는 라이브러리 npm i sequelize https://sequelize.org/MongoDB - MongoDB는 NoSQL 데이터베이스로 문서 기반 데이터 저장 방식을 채택한 오픈소스 DBMS - 관계형 데이터베이스와는 달리 스키마가 없으며, BSON(Binary JSON) 형태로 데이터를 저장 - 유연성이 좋고, 대규모 데이터 처리에 용이 MongoDB Atlas - MongoDB의 관리형 클라우드 데이터베이스 서비스 - MongoDB 데이터베이스를 클라우드에서 호스팅 하고 관리하는 것을 중심으로 하며, 개발자 및 기업이 손쉽게 애플리케이션을 빌드하고 배포할 수 있도록 지원 // db/datab.. pj, 6일차 ORM(객체 관계 매핑, Object Relational Mapping) - 객체 지향 프로그래밍 언어에서 사용되는 객체와 관계형 데이터베이스 간의 불일치를 해결하기 위한 기술 - 객체 모델과 관계형 데이터베이스의 테이블 간의 매핑을 수행하여 개발자가 SQL 쿼리 대신 객체 지향 코드를 사용할 수 있도록 함 ODM(객체 문서 매핑, Object Document Mapping) - NoSQL 데이터베이스와 객체 지향 프로그래밍 언어 간의 매핑을 제공하는 기술 - 주로 문서 지향 데이터베이스(MongoDB)와 함께 사용 현재 작업중인 브랜치를 확인 - 목록을 확인 git branch - * 표시가 되어 있는 것이 현재 작업중인 브랜치 branch 생성하기 git branch 브랜치이름 branch .. pj, 5일차 // controller/auth.jsimport * as authRepository from '../data/auth.js';import bcrypt from 'bcrypt';import jwt from 'jsonwebtoken';import { config } from '../config.js';// async function makeToken(id){// const token = jswonwebtoken.sign({// id: id,// isAdmin: false// }, secret, {expiresIn: '1h'})// return token;// }function createJwtToken(id){ return jwt.sign({id}, c.. pj, 4일차 // router/auth.jsimport express from "express";import { body } from 'express-validator';import * as authController from '../controller/auth.js';import { validate } from "../middleware/validator.js";import { isAuth } from '../middleware/auth.js';const router = express.Router();const validateLogin = [ body('username').trim().notEmpty().withMessage('username을 입력하세요'), body('password').trim().. pj, 3일차 Authentication(인증) 1. sesson & cookie 쿠키 - 클라이언트 컴퓨터에 저장되는 작은 데이터 조각 - 서버로부터 전송되어 클라이언트 웹 브라우저에 저장 - 텍스트 형식으로 주로 사용자 인증, 설정, 장바구니 등에 사용 세션 - 웹 서버 측에서 유지되는 상태 정보 - 사용자에 대한 고유한 세션ID를 통해 식별 - 서버 메모리 또는 데이터베이스에 저장할 수 있음 2. JWT(JSON Web Token) - 웹 애플리케이션과 서비스 간에 정보를 안전하게 전달하기 위한 인증 및 권한 부여 매커니즘을 구현하는 데 사용되는 표준화된 방법 중 하나 - JSON 포멧을 사용하여 정보를 표현하고 서명 및 암호화를 통해 정보의 무결성을 보장 { Header | Payload | Signat.. pj, 2일차 리팩토링 - 소프트웨어 개발 과정에서 코드를 재구성하여 가독성을 높이고 유지보수를 쉽게 만드는 과정 - 코드의 구조를 개선하고 중복을 제거하여 더 나은 설계 패턴을 도입함으로 코드의 품질을 향상 - 코드의 기능을 변경하지 않으면서 코드를 개선하는 방법 // data/tweet.jslet tweets = [ { id: '1', text: '안녕하세요!', createdAt: Date.now().toString(), name: '김사과', username: 'apple', url: 'https://www.logoyogo.com/web/wp-content/uploads/edd/2021/02/logoyogo-1-45.jpg' .. 이전 1 2 3 4 5 ··· 12 다음
