하단에 댓글 쓰는 컴포넌트 구현 import React, { useState, useRef } from 'react'; import '../css/comment.css'; function Commentwrite({onCreate}) { const contentInput = useRef(); const authorInput = localStorage.getItem('authId'); const [state, setState] = useState({ author:authorInput, content: "", rating: "", }); const handleChangeState = (e) => { setState({ ...state, [e.target.name]: e.target.value, }); }; c..

마크업 하면서 제작해둔 컴포넌트였는데..... 데이터 넣으면서 리팩토링했다. 만드는 순서는 1. 별 한개를 만든다. 2. item의 별점을 props로 받는 별의 리스트를 만든다. 별 한개 만들기 import { useState } from 'react'; function Star({ selected = false }) { return ( {selected ? () : ()} ) }; export default Star; Start 컴포넌트의 기본값으로 들어가는 props는 false다. 별 모양의 아이콘 폰트를 2가지의 경우로 만들고(선택했을 때 / 선택하지 않았을 때) 들어오는 props가 true일 경우에 선택했을 경우의 UI를 노출한다. 아이템의 별점을 props로 받는 별의 리스트 import ..

연산 크기 순서 O(1) < O(log n) < O(n) < O(n log n) < O(n2) < O(n3) < O(2n) < O(n!) < O(∞) * 시간 복잡도 연산 크기가 작은 순서대로 작성, 번호가 올라갈 수록 연산의 크기가 증가 * 시간 복잡도란? = 얼마나 빠른가 1. O(c) 또는 O(1) : 상수 시간 알고리즘 - 입력 갯수에 관계 없이 수행 속도(계산 횟수)는 1번 = 가장 효율적임 - 백준 24262번이 상수 시간 알고리즘 https://www.acmicpc.net/problem/24262 2. O(log n) : 로그 시간 알고리즘 - 데이터가 2배로 증가할 때, 연산의 수가 1단계 늘어나는 형태 ex. 이진검색 3. O(n) : 선형 시간 알고리즘 - 입력 개수에 비례적으로 수행 ..

DB에 api로 가져오는 데이터를 넣으려고 파이썬과 오라클 연동을 시도했는데, cx_Oracle 깔면서 자꾸 pyproject.toml-based project가 필요하다는 오류가 떴다. MySQL 연동은 쉽게 했는데 오라클은 맥이랑 호환이 안 좋은지 예전 설치서부터 파이썬 연동까지 자꾸 문제가 터져서 진짜 포기할 뻔... 다행히 환경 변수 설정하고 X Code 설치하니까 된다!^^;

클라이언트가 서버에게 요청(Request)를 보내면 서버는 그 요청을 받아 응답(Response)한다. 숫자로 된 상태 코드와 함께 클라이언트 쪽에 서버의 응답이 오는데, 보통은 200(성공)과 404(실패)로 나눌 수 있으며 주요 상태 코드는 100번대부터 500번대까지 다양하게 존재한다. 다양한 오류를 모두 경험해보는 그 날까지...고고 * 1xx - 조건부 응답 클라이언트가 데이터를 일부만 포함해 보내어, 서버가 데이터를 더 보내라고 하는 의미의 응답 코드 * 2xx - 성공 GET 요청에 대해 성공하면 200번대의 상태 코드로 돌아온다. * 3xx - 리다이렉션 300번대는 클라가 이전 주소로 데이터를 요청하여 서버에서 새 URL로 리다이렉트를 유도하는 경우이다. 클라에서는 요청을 마치기 위한 추..

html을 빨리 작성/수정하는 것으로 생산성을 증가시킬 수 있다! 아래 단축키 입력하고 + Enter 키 누를 시 코드가 빠르게 작성된다. 1. div.클래스명 혹은 .클래스명 2. div#아이디명 3. div>ul>li : div 태그 안의 ul 태그 안의 li 태그 작성 4. div>ul+ol : div 태그를 부모로 ul, ol이 형제 관계로 들어감 5. div>(header>ul>li*2>a)+footer>p 6. p{hello} : p태그 안에 { }안의 문자 삽입 hello 7. p.class${item $}*5 item 1 item 2 item 3 item 4 item 5 8. p>lorem : p 태그 안에 lorem lipsum의 전체 문구 삽입 Lorem ipsum dolor sit a..