React

박스 4개를 준비하고 그 박스들을 감쌀 slider 와 그 slider를 감쌀 container를 준비해 줍니다.여기에 css를 이용하여 각각의 박스에 색상과 크기를 지정해 주겠습니다.이렇게 각각 300px의 크기를 지닌 4개의 박스를 만들었습니다.구현하고자 하는 슬라

무한스크롤이란? 연속적인 스크롤을 제공하는 UI/UX 요소를 말한다. 웹이나 앱에서 스크롤이 페이지의 끝에 도달했을 때, 자동으로 다음 데이터를 요청하여 받아오는 방식 으로 별도의 페이지 이동없이 데이터를 계속 요청하기에 자주 사용되는 기능이다. 유튜브에서 화면

이번에 React 와 Matter-js를 이용해서 수박게임을 만들어 보겠습니다.목표로 하는 화면입니다.구현이 가능할 지 모르겠지만 최선을 다해보도록 하죠!이번 수박게임 구현에 가장 큰 역할을 할 Matter-js 입니다.Matter-js 는 2D 게임의 물리엔진 역할을

저번에 만든것에 이어 만들어 보겠습니다. 1. 과일만들기 > 과일을 만들기 위해서 과일이 만들어진 파일이 있어야 합니다. public 폴더에 00 부터 10 까지 이름을 가진 과일들을 저장해 두었습니다. 이후 fruits.js 라는 이름으로 src 폴더에 js 파

React Docs 에 따라서 npx create-react-app my-app --template typescript 로 bash 창이나 cmd 창에서 실행 시키면 됩니다.React + TypeScript 프로젝트를 최초 생성하면 tsconfig.json 설정을 조금

개발을 진행하다 보면 Login 기능을 이용하여 페이지를 라우팅 처리하는 경험이 있습니다.이때 페이지의 라우팅과 관련하여 사용자가 페이지 동작과정을 알고있다면 주소에 직접 번호를 작성하거나 특정 글자를 작성하여 페이지 이동을 실시할 수 도 있습니다. 이를 악용한다면 특

웹 어플리케이션의 성능을 향상시키는 기술 중 하나입니다.웹 페이지기 처음 로드될 때 필요하지 않은 리소스(이미지, 스크립트, 컴포넌트...) 등등 를 로드하지 않는 방식입니다.React의 경우 웹 페이지를 최초 로드할 때 모든 데이터를 로드한 후 페이지를 그리기 때문에

팀 프로젝트나 개인 프로젝트를 진행하다 보면 문득문득 CSS가 마음에 들지 않아 싹 갈아 엎어버리고 싶은 경우가 많았습니다. 그럴때마다 CSS로는 어디까지 할 수 있지? 라는 의문과 함께 이것도 되나? 저것도 되나? 등 생각을 해보는데 오늘은 제가 생각했던 것들이 구