전체 글

아래 내용은 Mysql 설치 및 데이터베이스 생성이 완료되었다는 가정하에 진행합니다.  시퀄라이즈란?Sequelize는 Node.js의 ORM(Object-Relational Mapping) 라이브러리로, SQL 쿼리를 작성하지 않고 JavaScript 코드로 데이터베이스 작업을 수행할 수 있습니다.  Sequelize 설정패키지 설치npm install sequelize sequelize-cli mysql2 Sequelize 초기화Sequelize CLI를 사용하여 프로젝트를 초기화합니다.이 명령어는 config, models, migrations, seeders 폴더를 생성합니다.npx sequelize-cli init  데이터베이스 설정config/config.js 파일에서 데이터베이스 설정을 변경..

https://www.typescriptlang.org/ko/docs/handbook/2/everyday-types.html#%EC%9B%90%EC%8B%9C-%ED%83%80%EC%9E%85--string-number-%EA%B7%B8%EB%A6%AC%EA%B3%A0-boolean Documentation - Everyday Types언어의 원시 타입들.www.typescriptlang.org 원시 타입stringnumberboolean 배열ex) [1,2,3]=> number[] 모든 타입any 사용법변수에 대한 타입 표기let myName: string = "Alice";하지만 대부분의 경우, 타입 표기는 필요하지 않습니다.가능하다면 TypeScript는 자동으로 코드 내의 있는 타입들을 추론하고자..

https://www.typescriptlang.org/ko/docs/handbook/2/basic-types.html Documentation - The BasicsTypeScript를 배우는 첫 걸음: 기본 타입.www.typescriptlang.org 그래서 JS보다 TS가 좋은 점이 뭔데?1. 실행 전에 오류를 잡아줌예를 들어 JS에서는 직접 기능들을 테스트하는 과정에서 발견할 수 있는 오류들(ex) 버튼 클릭시 데이터 관련 오류 발생)을 컴파일 과정에서 미리 발견할 수 있다.2. 타입을 지정함으로써 해당 타입의 자동완성 기능을 제공한다.위 이미지들에서 볼 수 있듯이 타입을 설정하면 TS가 해당 인수의 자료형을 알 수 있기 때문에 Date 객체에 맞는 자동완성 기능을 제공한다. 느낀점위 2가지만 ..

https://inpa.tistory.com/entry/VScode-%E2%8F%B1%EF%B8%8F-%EC%83%88%ED%8C%8C%EC%9D%BC-%EC%83%88%ED%8F%B4%EB%8D%94-%EB%8B%A8%EC%B6%95%ED%82%A4-%EC%84%A4%EC%A0%95

서버 컴포넌트란?서버 컴포넌트는 서버 측에서 렌더링되는 컴포넌트입니다.주로 서버에서 직접 데이터를 가져오거나, 비동기 작업을 수행한 후 HTML을 생성하여 클라이언트로 전달합니다.필자의 주관적 이해 : 주문이 들어오면(페이지 입장) 망치(JS)로 작업(데이터 가져오기 등) 후 작업물(완성된 HTML)만 보내줌렌더링 위치서버주요 특징클라이언트에 전달되는 HTML을 서버에서 미리 생성하기 때문에 클라이언트에서 실행되는 JavaScript 코드가 필요하지 않습니다.데이터 가져오기와 같은 무거운 작업을 서버에서 처리하여 클라이언트의 부하를 줄입니다.클라이언트 측의 초기 로딩 시간을 줄일 수 있습니다.서버에서만 접근 가능한 리소스나 환경 변수 등을 안전하게 사용할 수 있습니다.사용자가 자주 변화하지 않는 정적 콘..

https://github.com/LDK1009/ClubProject/tree/main GitHub - LDK1009/ClubProjectContribute to LDK1009/ClubProject development by creating an account on GitHub.github.com

아이템 우측 하단에 원을 클릭 시 해당 원의 크기가 커지며 화면을 덮는 애니메이션을 구현하였습니다.import { motion } from "framer-motion";import React, { useState } from "react";import styled from "styled-components";const Item = () => { // 원 클릭 여부 state const [isClick, setIsClick] = useState(null); return ( // 아이템 {/** * 아이템 우측 하단 원 * 클릭 시 isClick 상태가 변경된다. * animate는 isClick이 true일 경우 애니메이션 객체를 전달하도록 설정..

질문1 js는 단일 스레드라 한번에 하나의 작업만 수행할 수 있다.그렇다면 콜스택에는 절대로 2개 이상의 작업이 쌓이지 않는 것이 아닌가?ex) 콜스택에 쌓기 -> 콜스택 실행 -> 콜스택에 쌓기 -> ...반복 답변JavaScript는 단일 스레드이기 때문에 한 번에 하나의 작업만 실행할 수 있습니다. 하지만 콜 스택에는 여러 작업이 동시에 쌓일 수 있습니다.콜 스택은 현재 실행 중인 함수와 해당 함수에서 호출한 다른 함수들을 추적하는 데 사용됩니다. 아래는 콜 스택이 어떻게 작동하는지 설명하는 예제와 함께 좀 더 자세한 설명입니다. 예제 코드 function first() { console.log('First'); second(); console.log('First End');}function ..