const powerSet = function (str) { // 정렬 const sorted = str.split('').sort(); //각자 문자로 분리하여 알파벳 정렬 후 배열에 저장한다. // 중복 제거 const deduplicated = sorted.reduce((acc, item) => { //첫번째는 이전까지의 계산 결과를 누적하는 변수 //두번째는 배열의 요소 하나 if (acc[acc.length - 1] === item) { return acc; } else { return acc.concat(item); } }); let subSets = []; const pickOrNot = (idx, subset) => { // base case if (idx === deduplicated.l..
Unit5 - [컴퓨터 공학] 기초
컴퓨터 구조 SW(하드웨어 위에서 제어 , 작업을 수행하는 프로그램)+HW(전자회로 및 기계장치로 입출력 장치 , 중앙처리장치(CPU) , 기억장치 입력 장치 컴퓨터가 처리할 수 있는 형태로 데이터와 명령을 받아들이는 물리적인 장치 출력장치 처리된 데이터를 사람이 이해할 수 있는 형태로 출력하는 물리적인 장치를 의미 중앙처리장치 CPU의 내부 구성은 크게 산술/논리 연산 장치(ALU)와 제어 장치, 레지스터(데이터를 일시적으로 저장하는 장소)로 구성 저장 장치 데이터나 프로그램을 보관하기 위한 일차 기억 장치인 주 기억 장치(Memory)와 주 기억 장치를 보조하기 위한 디스크와 씨디 같은 보조 기억 장치가 존재 주 기억장치(RAM , ROM) 레지스터 용량이 작아 주로 정보를 저장해두었다가 읽어들이는 ..
json-server 라이브러리 직접 DB를 만들고 서버를 구축할 필요 없이 json 파일을 이용하여 REST API 서버를 구축해주는 라이브러리 json-server는 앱의 프로토타입을 만들거나 학습을 위해 서버가 필요할 때 사용하는 용도 json-server --watch data.json --port 3001 이 시스템에서 스크립트를 실행 할수 없다고 에러가 나왔다. 스터디홀에서 질문하여 해결방법을 찾았다 VSCode 오류 : 이 시스템에서 스크립트를 실행할 수 없으므로 ... (tistory.com) { /* delete 버튼을 누르면 다시 home으로 리다이렉트 되어야 합니다. */ /* useNavigate()를 이용하여 handleDeleteClick 로직을 작성해주세요. */ fetch(`..
custom hook을 이용하여 useEffect 로직 분리하기 hook.js import { useEffect, useState } from "react"; const useFetchData = (fetchUrl) => { const [data, setData] = useState(); useEffect(() => { fetch(fetchUrl, { headers: { "Content-Type": "application/json", Accept: "application/json" } }) .then((response) => { return response.json(); }) .then((myJson) => { setData(myJson); }) .catch((error) => { console.log(..
React에는 Virtual DOM이라고 하는 가상의 DOM 객체가 있다. Real DOM의 가벼운 사본과 같다. Real DOM (DOM) DOM은 Document Object Model의 약자 DOM은 브라우저가 HTML 문서를 조작할 수 있도록 트리 구조화한 객체 모델 querySelector, addEventListener와 같은 DOM API를 통해 문서의 요소들을 조작 브라우저 렌더링 과정에서 브라우저는 렌더링 과정에서 DOM 트리와 CSSOM 트리를 토대로 Render 트리를 생성하고 각 요소가 배치될 공간을 계산(Layout)한 뒤 이를 화면에 그려낸다. 이때 DOM이 변경되면 DOM트리를 재건축하게 되는데 레이아웃 재연산을 수행하는 리플로우, 그리고 이를 화면에 그려내는 Repaint 과..
function orderOfPresentation(N, K) { // 조의 개수 N, 발표 순서 K const factorial = (n) => { if (n el === false).length; // 사용하지 않은 수의 경우의 수를 카운트한다. const formerCnt = validCnt * factorial(N - i - 1); // order에 추가 order = order + formerCnt; } return order; 인덱스 0에는 아무 데이터나 넣어놓고, 실제 조의 번호를 사용할 때는 인덱스 1부터 사용하는 방법을 사용하고, 인덱스 0은 더미 데이터로 사용 ex ) 3, [2,3,1] IsUsed [ false , false , false ,false] candidate = [ fa..
웹팩 과제
간단한 웹앱 번들링 src에 js,html,css 파일을 넣는다. 1.현재 디렉토리에 npm 설치 npm init -y 설치후 package.json 파일이 생성된다. 2. webpack 설치 npm install -D webpack webpack-cli Node.js 프로젝트에서 webpack과 webpack-cli를 개발 의존성(dependency)으로 설치하는 것을 의미 3. webpack.config.js 파일 만들기 const path = require('path'); module.exports = { entry: './src/index.js', output: { filename: 'app.bundle.js', path: path.resolve(__dirname, 'dist'), }, } 4.j..
튜토리얼1 디렉토리생성 npm init-y index.js under.js 웹팩설치 npm install -D webpack webpack-cli 번들링하기 npx webpack 개념 enrty 경로 파일에서 필요한 모든 것을 webpack이 모아서 번들링한다. 번들링의 결과물이 output 경로로 산출 튜토리얼2 loader는 JavaScript, JSON이 아닌 파일을 불러오는 역할 튜토리얼3 플러그인은 번들링 과정 중에 개발자가 원하는 다양한 작업을 할 수 있도록 도와준다. html-webpack-plugin은 번들링 과정 중 html 파일을 자신이 원하는 형태로 가공하여 번들에 포함