분류 전체보기

한 번씩 잊어먹어서 메모처럼 정리해보기로! 동시에 Promise와 async/await의 작성 방식도 복습하자 JavaScript의 API 데이터 가져오는 방법 (1) XMLHttpRequest 오래된 방법..! 사용 경험이 없어 낯설지만 기록해둔다. let xhr = new XMLHttpRequest(); xhr.open("GET", "https://api.example.com", true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 & xhr.status === 200) { let responseData = JSON.parse(xhr.responseText); console.log(responseData); } } xhr.send..

발단, 에러 상황 발견 Next.js 기초 공부하던 어느 날 여태 노트북으로 작업하다가, 데스크탑에서 이어 작업하기 위해 GitHub 저장소부터 새로 clone 하고 있었다. 그런데 웬열? 패키지 설치까지 하고 파일들을 살펴보고 있는데 에러가 발생하고 있는 컴포넌트를 확인..! 분명히 노트북에서 에러 없이 정상 작동하도록 작업한 뒤 push 한 상태일 텐데 특정 코드에서 type error가 발생했다. Type '{ children: string; jsx: true; global: true; }' is not assignable to type 'DetailedHTMLProps'. styled JSX를 사용한 영역에 지정된 타입이 없다는 문제였다. 이게 갑자기 어디서 나타난 에러지? 원래 전에는 됐는데??..

React Query (TanStack Query) https://tanstack.com/query/v3/ TanStack Query | React Query, Solid Query, Svelte Query, Vue Query Instead of writing reducers, caching logic, timers, retry logic, complex async/await scripting (I could keep going...), you literally write a tiny fraction of the code you normally would. You will be surprised at how little code you're writing or how much tanstack.com (r..

작업 내용 GitHub - sryung1225/javascript-racingcar-6 Contribute to sryung1225/javascript-racingcar-6 development by creating an account on GitHub. github.com 작업 주요 일정 과제 기한 : 2023.10.26(목) - 2023.11.01(수) 10/27(금) : 구현해야 할 기능 목록 정리 & 프로젝트 셋팅 10/28(토) : 기능 구현 & 리팩토링 & 회고 작성 11/1(수) : 리팩토링 & 테스트 & 회고 작성 및 제출 회고 1) 주석이 필수는 아니구나! 지난 회고 1 에서는 동작 순서나 세부적인 내용에 대해 주석을 다양하게 활용해봤고 이게 좋은 습관인 것 같아 앞으로도 활용해보겠다고 ..

작업 내용 [숫자 야구 게임] 이성령 미션 제출합니다. by sryung1225 · Pull Request #184 · woowacourse-precourse/javascript- 작업에 대한 회고는 블로그로 대체합니다! https://s-ryung.tistory.com/66 (26일 게시 예약) github.com 작업 주요 일정 과제 기한 : 2023.10.19(목) - 2023.10.25(수) 10/20(금) : 작업 레포지토리 설정 & 구현해야 할 기능 목록 정리 10/22(일)-10/23(월) : 주요 기능 작업 10/25(수) : 회고 작성 및 제출 회고 1) 구현 기능 체크리스트의 필요성 기능을 구현하기 전 docs/README.md 에 구현할 기능 목록을 정리하는 것이 과제 진행 요구 사항..

React HooksReact v16.8에서 도입된 새로운 기능함수형 컴포넌트에서 상태와 생명주기 기능을 사용할 수 있게 함이전에는 클래스 컴포넌트에서만 상태를 가질 수 있었음 클래스 기반 컴포넌트의 단점컴포넌트 간 상태 로직을 재사용하기 어려움비슷한 형태의 상태 로직을 각 컴포넌트에서 직접 작성해야 했음생명주기 메서드에서 서로 관련 없는 로직들이 얽혀 코드의 복잡성을 증가시키는 문제가 있었음생명주기 메서드란? 컴포넌트의 특정 시점에 호출되는 메서드componentDidMount: 컴포넌트가 마운트된 직후에 호출componentDidUpdate: 컴포넌트가 업데이트된 직후에 호출위와 같은 생명주기 메서드에서만 상태 업데이트에 대한 사이드 이펙트를 처리할 수 있었음 정리하자면 클래스형 컴포넌트는 프로젝트 ..

스파르타코딩클럽 [GPT] 웹개발 종합반 : 최지웅 https://spartacodingclub.kr/online/web_chatgpt 스파르타코딩클럽 | [GPT] 웹개발 종합반 입문자부터 실무자까지 개발자 커리어에 꼭 필요한 웹 페이지 제작의 모든 것을 배웁니다. spartacodingclub.kr Flask 프로젝트에 DB 연결하기 앞서 만들던 멜로디쉐어 프로젝트에 SQLite를 연결해 사용해본다. 만들고 싶은 기능은 form으로 부터 받은 데이터(최애 음악)를 DB에 저장하는 것이다. # app.py 상단 from flask import Flask, render_template, request app = Flask(__name__) # DB 기본 코드 import os from flask_sqla..

스파르타코딩클럽 [GPT] 웹개발 종합반 : 최지웅 https://spartacodingclub.kr/online/web_chatgpt 스파르타코딩클럽 | [GPT] 웹개발 종합반 입문자부터 실무자까지 개발자 커리어에 꼭 필요한 웹 페이지 제작의 모든 것을 배웁니다. spartacodingclub.kr Database (DB) 데이터의 모음. 파일. 우리 눈에 보이지는 않지만 Database에는 Index라는 순서로 데이터들이 정렬되어 있는데 이를 이용해서 데이터를 잘 넣고, 나중에 찾을 때도 쉽게 찾을 수 있다. Database의 두 가지 종류 RDBMS(SQL) ex) SQLite, MS-SQL, My-SQL 등 행/열의 생김새가 정해진 Excel에 데이터를 저장하는 것과 유사하다. 정형화되어 있는 ..

스파르타코딩클럽 [GPT] 웹개발 종합반 : 최지웅 https://spartacodingclub.kr/online/web_chatgpt 스파르타코딩클럽 | [GPT] 웹개발 종합반 입문자부터 실무자까지 개발자 커리어에 꼭 필요한 웹 페이지 제작의 모든 것을 배웁니다. spartacodingclub.kr Flask 플라스크란? 파이썬 기반의 웹 프레임워크 사용자의 요청에 맞춰 HTML 파일을 응답해주는 Flask 서버를 만들 수 있다. +) 1대의 컴퓨터에다가 서버도 만들고 요청을 하게되는 경우 클라이언트 = 서버 인 상태가 되는데 이를 로컬 개발환경이라고 한다. Flask 시작하기 기본 설치하기 사용할 프로젝트를 열람한 뒤 > 가상환경 설치 (* 설치 방법) 후 확인 > flask 설치 $ pip ins..

스파르타코딩클럽 [GPT] 웹개발 종합반 : 최지웅 https://spartacodingclub.kr/online/web_chatgpt 스파르타코딩클럽 | [GPT] 웹개발 종합반 입문자부터 실무자까지 개발자 커리어에 꼭 필요한 웹 페이지 제작의 모든 것을 배웁니다. spartacodingclub.kr Python 파이썬이란? 인터프리터식, 고수준 프로그래밍 언어. 간결하고 읽기 쉬운 문법을 가져 다양한 분야에서 활용되고 있는 프로그래밍 언어 설치 3.8.6 버전 설치 (window) https://www.python.org/ftp/python/3.8.6/python-3.8.6-amd64.exe (mac) https://www.python.org/ftp/python/3.8.2/python-3.8.2-ma..