본문 바로가기

SAC21

[새싹x코딩온] 풀스택 개발자 부트캠프 과정 11 주차-2 React React Event📌리액트에서는 Javscript의 onclick, onMousedown 등의 이벤트 핸들러를 별도로 제공하는데 (기능은 동일함) 다만 표기방법이 약간 틀리다 예로 onclick 은 onClick으로 카멜 케이스 표기명으로 사용한다 그리고 함수를 호출법도 약간 틀린데 onclick="func()" 가 아닌 onClick={func} 으로 JSX문법을 사용하여 변수를 호출하듯 사용한다const LifeCycleFunc = () => { const [number, setNumber] = useState(0); const [visible, setVisible] = useState(true); const changeNumber = () => { setNumber(number + 1.. 2025. 1. 11.
[새싹x코딩온] 풀스택 개발자 부트캠프 과정 11 주차-1 React 리액트란 무엇인가?🤔리액트는 프론트엔드의 꽃이자 그 자체라고 할 수 있다 동적 사용자 인터페이스를 사용하기 위해 페이스북에서 만든 오픈소스 Javascript 라이브러리이다 쉽게 말하면 화면(View)을 만들기 위한 자바스크립트 라이브러리 사용자와 상호작용이 가능한 동적 UI제작가능하다 어떤 프로젝트에 적합한지?데이터 변경이 잦게 일어나거나 복잡하고 규모가 큰 프로젝트에 적합하다 이 이유는 바로 리액트가 양방향 데이터플로우가 아닌 단방향 데이터플로우를 갖고 있기 때문인데 양방향은 규모가 커질수록 데이터흐름 추적의 어려움이 있고 복잡해지는 경향이 존재한다 컴포넌트구조?리액트는 컴포넌트 단위로 쪼개져있는데 이 때문에 전체코드 파악이 쉽고 유지보수또한 편리하다 기능 또는 UI 단위 캡슐화를 하여 코드를 관리.. 2025. 1. 7.
[새싹x코딩온] 풀스택 개발자 부트캠프 과정 7주차-2 jwt, storage JWT 란?JWT JSON Web Token은 사용자가 자신의 신원이나 특정 권한을 증명하기 위해 JSON 형식의 데이터를 안전하고 compact한 형태로 표현하는 토큰입니다 JWT는 주로 클라이언트와 서버 간 인증 및 권한 부여에 널리 활용되며, 인증된 사용자 세션을 관리하는 데에도 자주 사용됩니다 JWT는 “Header”, “Payload”, “Signature” 세 부분으로 구성되며, 각각 ‘.’(점)으로 구분됩니다Header - JWT가 사용하고 있는 알고리즘 정보(예: HS256, RS256)와 토큰 타입(JWT)을 포함합니다예시: `{"alg": "HS256", "typ": "JWT"}` Payload 페이로드 - 실제 인증 정보나 사용자 정보(예: 사용자 ID, 권한), 만료 시간(exp),.. 2024. 12. 20.
[새싹x코딩온] 풀스택 개발자 부트캠프 과정 7주차-1 session, cookie 세션이란?세션은 사용자를 식별하고 그에 따른 상태나 정보를 서버 에서 유지하기 위한 일반적인 메커니즘입니다 세션은 주로 쿠키Cookie와 연동하여 작동합니다 클라이언트는 서버가 발급한 세션을 쿠키로 보관하고, 이후 요청 시 해당 쿠키를 서버에 전송함으로써 사용자가 누구인지 식별할 수 있고 그 사용자에 해당하는 상태나 데이터를 서버 측에 저장해둘 수 있게 됩니다 Node.js 의 세션사용!const express = require('express');const session = require('express-session');const app = express();app.use(session({ secret: '비밀 키 문자열', // 세션 암호화를 위한 키 resave: false, .. 2024. 12. 17.
[새싹x코딩온] 풀스택 개발자 부트캠프 과정 6주차-1 회고 | Express to MySQL Node.js에서 서비스를 개발할때 로컬 파일을 통한 데이터 저장이 아닌 외부 저장소(DB)를 통해 데이터를 통해 관리해야하는데 이때 사용되는 프레임워크가 바로 MySQL입니다 데이터베이스 프로그램엔 오라클, MSSQL, 마리아DB 등 다양한 프로그램이 많지만 대표적으로 많이 사용되는 프로그램이 MySQL입니다 MySQL 연동을 위한 준비Node.js 에서 MySQL을 사용하려면 별도의 MySQL을 설치해줘야합니다npm install mysqlnode CLI에서 해당 코드를 작성하면 mysql이 정상적으로 설치됩니다※ 주의사항 PC에 MYSQL 9.0버전 이상이 설치되어 있을 경우 mysql2 를 설치합니다 아래 코드를 시작하기 전 미리 test 이름의 데이터베이스를 생성해주세요 MySQL 연동const.. 2024. 12. 6.
[새싹x코딩온] 풀스택 개발자 부트캠프 과정 5주차-2 회고 | MySQL, MVC 패턴 DB란?DB는 데이터베이스라는 뜻으로 체계적으로 정리된 데이터의 집합을 의미합니다 데이터를 쉽게 접근하고 수정하면서 필요한 정보를 보다 효과적으로 제공하는것이 목적입니다DBMS 란?DBMS는 데이터베이스를 관리하고 사용할 수 있게 해주는 일종의 소프트웨어를 뜻하며 DBMS는 데이터를 정의, 생성, 유지, 검색, 갱신, 삭제 하는 기능을 제공하며 데이터의 보안, 일관성, 무결성을 유지하면서 사용자나 데이터를 요청하는 프로그램이 데이터를 쉽게 사용 할 수있도록하는 프로그램입니다 RDBMSRDBMS 는 관계형 데이터베이스라고 불리며 데이터를 테이블(행과 열) 형식으로 저장하며 각 테이블은 서로 관계를 가질 수 있는 데이터의 방식입니다 SQL 이라는 언어를 사용하여 데이터를 조작하며 대표적으로 MySQL, Or.. 2024. 12. 1.