Irene88

✨ fetch 브라우저에 내장된 기본 API입니다. 별도 설치 없이 바로 사용 가능.Promise 기반으로 작동해요.기본적으로 fetch는 요청이 실패해도 (ex: HTTP 404, 500 에러) reject되지 않고, 성공한 것으로 간주합니다. → 직접 response.ok 등을 체크해야 해요.응답 데이터를 .json(), .text()처럼 명시적으로 파싱해야 해요.구식 브라우저에서는 (ex: IE) **폴리필(polyfill)**이 필요할 수 있어요.예시fetch('https://api.example.com/data') .then(response => { if (!response.ok) { throw new Error('네트워크 응답에 문제가 있어요!'); } return ..

리액트 사용할때 그냥 생각없이 사용했었는데, 이번에 열심히 그 개념과 내용들을 찾아보고 정리를 해둔다. 🎨 styled-components란?styled-components는CSS를 JavaScript 안에 작성할 수 있게 해주는 라이브러리즉, CSS 파일 따로 안 만들고,컴포넌트 안에서 바로 스타일을 적용할 수 있다.✅ 특징:컴포넌트 단위로 스타일을 묶을 수 있어 → 코드 깔끔클래스 이름 충돌 걱정 없음 → 자동으로 고유 클래스 생성props로 스타일 제어 가능 → 동적인 스타일 만들기 쉬움 🛠️ 설치 방법Next.js 프로젝트에 styled-components 설치하려면:yarn add styled-components(이번 개인 실습용 프로젝트는 그냥 yarn으로 프로젝트를 설치했다.) (또는 ..

보통 백엔드와 프론트엔드 프로젝트 구축할 때 포트번호가 별도로 나뉜다.챗GPT에 너무나 궁금해서..백엔드와 프론트엔드 포트번호를 동일하게 설정하면 안되는지... 물어봤다. "백엔드 포트랑 프론트엔드 포트 똑같이 해도 돼?" 🎯 결론부터 말할게❌ 프론트엔드랑 백엔드는 포트를 똑같이 쓰면 안 돼.항상 서로 다른 포트를 써야 해.✨ 이유포트는 컴퓨터 안에서 '주소' 같은 거야.하나의 포트에는 하나의 프로그램만 연결될 수 있어.예를 들어 3000번 포트에 프론트엔드가 이미 서버를 열었다면,거기에 백엔드 서버를 또 띄우려고 하면 충돌나서 에러 터진다.프론트와 백엔드는 '다른 프로그램'이야.Next.js 개발서버 (yarn dev)는 자체 HTTP 서버를 연다.Node.js (Express) 서버도 또 다른..

여러 고민끝에 작은 프로젝트를 혼자서 해보기로 했다.막연히 유튜브의 동영상 강의들 쫓아 만들기보다는 차라리... 챗GPT로 서로 소통하면서 그리고 혼자서도 공부를 찾아가면서 만드는게 낫다는 판단이 들었다.그래서 어제 밤을 새서 어떤걸 만들까 하다가 간단한 게시판을 만들어보기로 했다.기반은 NodeJS로 백엔드를 NextJS로 프론트엔드를 그리고 DB는 익숙한 SQL Server (MS SQL)로 결정하고 만들기로 했다.어제 NodeJS와 NextJS 프로젝트를 각각 생성하고 기본적인 설정만 해 두었다. 만들다가 생각해보니 DB도 만들어야 했다. 그래서 만들었다.CREATE DATABASE feedDB SQL Server를 실무로 1년이상 사용해서 오라클보다 더 편했다.그리고 어제 내내 게시판을 위한 테이..