hanol hanol

화살표 함수 (Arrow Function)렉시컬 스코프화살표 함수는 자신이 정의된 위치에서의 this 값을 상속받습니다.따라서 화살표 함수 내에서 this를 사용할 때, 이는 화살표 함수가 정의된 외부 스코프의 this와 동일합니다.문법적 특징function 키워드를 사용하지 않고, 더 간결한 문법을 사용합니다.const myArrowFunction = () => { console.log(this); }일반 함수 (Regular Function)동적 스코프 일반 함수의 경우, this는 함수가 호출될 때 결정됩니다. 이는 해당 함수가 어떻게 호출되었는지에 따라 달라집니다.문법적 특징function 키워드를 사용하여 정의합니다.function myRegularFunction() { console.log(t..

오늘은 울고싶은날ㅜㅜ백엔드의 길은 멀고도 험난하다...1. 설치 환경MacBook Air 15macOS 13.4 2. 설치 방법자세하게 나와있어서 차례대로 설치해나가면 된다!https://mariadb.com/kb/ko/installing-mariadb-on-macos-using-homebrew/ Homebrew로 macOS에 MariaDB Server 설치Homebrew 패키지 매니저를 이용해서 MariaDB Server를 macOS (이전 Mac OS X) 설치할 수 있습니다. MariaDB Server는 미리 컴파일된 Homebrew "bottle" 패키지로 이용 가능하며, 소스 빌드가 필요 없어 시간을 절약해mariadb.com Homebrew 설치후에는Homebrew로 MariaDB server..

⬛ 제 1장 데이터 모델링의 이해🌓 데이터 모델링의 특징추상화현실세계를 일정한 형식에 맞추어 표현하는 추상화의 의미단순화복잡한 현실을 제한된 언어나 표기법을 통해 이해하기 쉽게 하는 단순화의 의미를 가지고 있음명확화애매모호함을 배제하고 누구나 이해가 가능하도록 정확하게 현상을 기술하는 정확화(=명확화) 🌓  데이터 모델링이란?정보시스템을 구축하기 위한 데이터 관점업무 분석기법현실세계의 데이터에 대해 약속된 표기법에 의해 표현하는 과정데이터베이스를 구축하기 위한 분석,설계의 과정🌓  데이터 모델링을 할 때 유의할 점 ( 중복, 비유연성, 비일관성 )여러 장소의 데이터베이스에 같은 정보를 저장하지 않도록 하여 중복성을 최소화한다. (중복)데이터의 정의를 데이터의 사용 프로세스와 분리하여 유연성을 높여 ..

NextJS 셋팅하기 npx create-next-app@12.0.7 --typescript npm i next@12.0.7 react@18.0.0-rc.0 react-dom@18.0.0-rc.0 > nextJS 최신 버전이 14인데 , 처음에 노마드코더는 nextJS 12 버전을 사용하고 있어서 폴더 구조가 좀 달라서 많이 당황했다;; 레포지토리 생성 rm -rf .git git init git remote add origin 원격 레포지토리 주소 Tailwind 설치하기 npm install -D tailwindcss postcss autoprefixer npx tailwindcss init -p 이렇게 입력하면 postcss.config.js와 tailwind.config.js 파일이 생김 tail..

문제 문자열 str과 정수 n이 주어집니다. str이 n번 반복된 문자열을 만들어 출력하는 코드를 작성해 보세요. const readline = require('readline'); const rl = readline.createInterface({ input: process.stdin, output: process.stdout }); let input = []; rl.on('line', function (line) { input = line.split(' '); }).on('close', function () { str = input[0]; n = Number(input[1]); }); 입력값 string 5 생각과정 console.log(input)을 하니 [ 'string', '5' ] 라는 결과값..

리액트를 공부를 하다가 리액트가 지금이야 대세이긴 하지만 몇년이나 갈 줄 모른다는 글들을 보았다. 그만큼 기술이 빠르게 변화한다고 하니 자바스크립트는 평생 쓰기 때문에 리액트개발자가 아니라 자바스크립트를 쓸 줄 아는 리액트 개발자가 되어야한다!는 생각이 들었다. 그래서 자바스크립트 공부도 할겸 알고리즘도 풀면서 차근차근 공부해보려고한다. 아주 쉬운 문제부터 하루에 풀 수있는 데까지 풀어나갈 생각이다. 최소 1문제 이상은 풀어보도록 해야겠다. 문제는 프로그래머스 코딩테스트 기초 문제에서 가져온 문제이다. https://school.programmers.co.kr/learn/challenges/training?order=acceptance_desc 코딩 기초 트레이닝 | 프로그래머스 스쿨 프로그래밍 언어를 ..

글쓰기, 게시글, 프로필 기능이 있는 블로그 프로젝트를 시작한지 1일차! 오늘은 설계부터 컴포넌트 구성까지 해보았는데 사용 기술과 라이브러리 선택에 앞서 선택하는 이유와 목적에 맞게 잘 써야 한다는 것을 깨달았다. 지금까지는 그냥 편해서 react 쓰고 react를 쓰니까 런타임 환경이 node.js쓰고 했었는데 설계 단계에서의 선택들이 프로젝트의 원활한 흐름과 효율을 올려주는 것 같다. 🥕 프로젝트 설계 단계에서 사용 기술과 라이브러리 선택 사용 기술과 라이브러리는 프로젝트의 효율성과 성능에 직접적인 영향을 미치기 때문에, 이를 목적에 맞게 잘 선택하는 것이 필요하다. React 는 사용자 인터페이스를 구축하기 위한 JavaScript 라이브러리이다. react는 컴포넌트 기반 아키텍처를 지원하여 코드..

🎯 Wrapper 란? => 불필요한 중첩을 피하기 위해 사용하는 태그 Wrapper라는 컴포넌트를 만들어서 감싸는 역할을 하는 경우에는 아래와 같이 간단한 형태로 작성할 수 있음 이 컴포넌트는 자식 컴포넌트들을 감싸서 특정한 스타일이나 레이아웃을 적용할 때 사용될 수 있다 const Wrapper = (props) => { return props.children; }; export default Wrapper; 🎯 Fragment 란? => 간결한 코드를 작성하는데 도움주는 태그 최종 페이지에 불필요한 HTML요소들이 표시 되지 않음 방법 1 ; 방법 2 ; 방법 3 import React, { Fragment } from "react"; 태그 썼을때 태그 썼을 때 => 화면에 태그요소가 나타나지 않음..