길용의 개발 발자취 길용의 개발 발자취

https://medium.com/hcleedev/web-react-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-github-pages%EB%A1%9C-%EB%B0%B0%ED%8F%AC%ED%95%98%EA%B8%B0-f62e59a2e210 Web: React 프로젝트 Github Pages로 배포하기무료 웹 호스팅 Github Pages를 이용해 React로 만든 프로젝트를 배포해보자medium.com  주의사항https://velog.io/@wjddma1202/React-react-router%EB%A5%BC-%EC%A0%81%EC%9A%A9%ED%95%9C-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8%EB%A5%BC-gitHub-pages%EB%A1%9C-..

https://dbdiagram.io/home dbdiagram.io - Database Relationship Diagrams Design Tool dbdiagram.io사이트 주소   데이터가 있으면 이를 SQL 쿼리로 변경하고 SQL 쿼리 IMPORT 해주면 ERD 그려준다편리.

useEffect는 컴포넌트 렌더링 될때마다 특정 작업을 실행할 수 있게 하는 Hook이다import React, { useState, useEffect } from 'react';function Example() { const [count, setCount] = useState(0); useEffect(() => { console.log('렌더링이 완료되었습니다.'); }); useEffect(() => { console.log('마운트 완료되었습니다.'); }, []); useEffect(() => { console.log(`count 상태가 ${count}로 변경되었습니다.`); }, [count]); return ( Count: {count} ..

nextLink = '\localhost';window.location.href = nextLink;페이지 이동시 기본으로 제공되는 window.location.href와 같은 내장함수를 사용시페이지가 새로고침(깜빡)되며 페이지가 이동된다. 리액트에선 새로고침 없이 페이지 이동을 위한 2가지 기능을 제공하고있다 1.function App() { return ( } /> } /> );} {'홈버튼'} App()에서 라우터를 지정해놓고로 이동시 새로고침 없이 이동된다   2.useNavigateimport { useNavigate } from 'react-router-dom..

리액트로 만든 웹에선 보안상의 이유로host의 로컬 파일에 접근이 불가능하다. 로컬파일의 내용을 읽어 api로 전달해주는 백엔드 서버를 node.js로 만들거나input으로 사용자의 파일을 직접 읽는 등의 우회적인 방법밖에 없다. REACT_APP_NOTION_TOKEN = secret_*******************************************REACT_APP_NOTION_DATABASE_ID = ********-****-****-****-************ 대신 환경변수로 간단한 문자열 값 정도는 전달이 가능하다.파일 이름은 '.env'이고(ㅁㅁ.env가 아닌 그냥 .env 이다) 변수명은 REACT_APP으로 시작해야하며따옴표나 쉼표, 세미콜론은 쓰지 않는다. git ignor..

목표 -> 리액트로 웹서버를 여는 프로그램을 단독 실행 파일(exe)로 만들기 리액트로 코드를 작성하고,터미널에 npm run build 입력시 리액트 프로젝트 소스코드가 빌드되어build 폴더에 index.html과 함께 저장된다. 또한 serve -s build로 빌드된 정적 파일을 로컬 웹 서버로 돌릴 수 있다. -> serve는 npm에 속하는 명령어고 npm은 node와 같이 설치되기에 결국 node가 필요하다.node를 깔지 않고 리액트트 프로젝트를 exe와 같은 단독 실행 파일로 만들려면?   https://velog.io/@khw970421/React-%ED%8C%8C%EC%9D%BC%EB%93%A4%EC%97%90-%EB%8C%80%ED%95%B4%EC%84%9C-index.js-App...

https://school.programmers.co.kr/learn/courses/30/lessons/42626?language=python3 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr import heapq def solution(s, k): answer = 0 heapq.heapify(s) if s[0]>=k: return answer while(1): answer +=1 s1 = heapq.heappop(s) s2 = heapq.heappop(s) heapq.heappush(s,s1+s2*2) if s[0]>=k: break if len(s) ..

배열 var arr2 = new Array(3); for (var i = 0; i < arr2.length; i++) {arr2[i] = new Array(2).fill(0);} 2차원 배열 선언 var arr = ['a', 'b', 'c']; arr.push('d'); //abcd let d = arr.pop(); //abc let a = arr.shift(); //bc arr.unshift('k'); //kbc push pop shift arr.indexOf('a'); //첫 'a' 위치 arr.includes('a'); //배열에 'a'가 있으면 true 리턴 arr.reverse() arr.sort() 필수 내장함수 let arr = ['a', 'b', 'c' ]; arr.splice(2, 0, ..