Gatsby 기반 Portfolio Site 만들기

an architecture designed to make the web faster, more secure, and easier to scale.자바스크립트와 HTML, CSS, API 기술을 사용하여 웹을 구성한다.기존 웹사이트와 달리 JAM Stack은 구성 방식

페이스북에서 개발한 API(애플리케이션 프로그래밍 인터페이스)를 위한 쿼리 언어이다. RestAPI는 양방향으로 고정된 데이터만 오고 가지만, GraphQL은 단방향으로 서버 측에서 런타임으로 클라이언트가 요청한 원하는 만큼만의 데이터를 제공한다.CRUD에서Read는

터미널에서 gatsby-cli 를 설치하고 이를 사용해서 프로젝트를 생성한 후, 다음과 같이 프로젝트에 들어가 로컬 서버를 실행하려 했으나 gatsby command not found 라는 오류가 났다.이를 해결하기 위해 다음과 같이 진행해주었다.1\. npm path

TypeScript JavaScript 기반 언어로, JavaScript는 클라이언트 측 스크립팅 언어인데 비해 TypeScript는 객체 지향 컴파일 언어이다. JavaScript의 모든 기능을 가지고 있다. Types JavaScript의 동적 타입으로 인한 문제

GraphQL이 제공하는 IDE. 이를 사용함으로써 어떤 데이터를 요청할 수 있는지 알 수 있음.GraphiPL IDE 링크: 다음과 같이 gatsby develop으로 서버 실행시 나오는 두 개의 링크 중 아래 거.GraphiPL IDE우리 사이트의 메타데이터를 가져

Gatsby에서 pages 폴더에 파일을 생성하면 바로 이 페이지로 갈 수 있는 url을 만들어준다.예시) pages 폴더에 info.tsx파일 있는 경우, 'http://localhost:8000/info'로 그냥 들어갈 수 있음.따라서 다음과 같이 a 태그

React에서의 스타일링 기법 CSS 일반 CSS를 통해 작성하여 스타일 파일을 작성하고 이를 컴포넌트 파일에서 불러와 적용한다. 스타일 적용시, 클래스 중복을 피하기 위해 기존 CSS Selector를 사용하거나 새로 클래스를 만들어 준다. BEM 네이밍 규칙 참고