분류 전체보기227 [React] React 코드 수정 방법 https://conquer-it.tistory.com/184 개발환경 구축을 완료하고 터미널에 npm start를 작성하면 많은 파일과 새로운 웹 페이지가 만들어진 것을 볼 수 있다. React 수정하는 법! 우리가 npm start를 작성하면 src안에 있는 index.js를 동작시킨다. 그렇다면 index.js에는 어떤 코드가 있을까? import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document... 2023. 1. 23. [React] React 개발 환경 구축하기 리액트는 메타에서 개발한 오픈 소스 자바스크립트 라이브러리이다. 또한, 프론트엔드 개발자 사이에서 가장 많이 사용되는 자바스크립트 라이브러리이다. 리액트 개발환경 구축하기 https://ko.reactjs.org/docs/getting-started.html 시작하기 – React A JavaScript library for building user interfaces ko.reactjs.org 리액트 시작 페이지에 오면 리액트를 어떻게 사용해야 하는지 잘 나와있다. (시간이 있는 사람은 읽어봐도 좋을 거 같다.) 만약 리액트를 배우고 싶긴 하지만 설치하는 건 번거롭고 귀찮다 하는 사람들을 위해 아래와 같이 온라인에서 리액트 환경에 접근할 수 있는 코드 편집기를 지원해주고 있다. CodePen CodeS.. 2023. 1. 20. [정처기-1과목] 1-2 요구사항 정의 & 분석 CASE와 HIPO 요구사항 정의 요구사항의 개념 및 특징 요구사항은 소프트웨어가 어떤 문제를 해결하기 위해 제공하는 서비스에 대한 설명과 정상적으로 운영되는데 필요한 제약조건 등을 나타낸다. 소프트웨어 개발이나 유지 보수 과정에서 필요한 기준과 근거를 제공한다. 소프트웨어의 내용을 확인할 수 있게 하므로 참여하는 이해관계자들 간의 의사소통을 원할하게 하는데 도움을 준다. 제대로 정의되어야만 이후 과정의 목표와 계획을 수립할 수 있다. 요구사항의 유형 일반적으로 기술하는 내용에 따라 '기능 요구사항'과 '비기능 요구사항'으로 구분하며, 기술 관점과 대상의 범위에 따라 '시스템 요구사항'과 '사용자 요구사항'으로 나눈다. 요구사항 개발 프로세스 개발 대상에 대한 요구사항을 체계적으로 도출하고 이를 분석한 후 분석 결과를 명세.. 2023. 1. 18. [WEB] 웹페이지에 스크롤 애니메이션 만들기 IntersectionObserver() IntersectionObserver() 사용 요즘 많은 웹 페이지들이 스크롤 애니메이션을 구현하여 조금 더 멋있어(?) 보이는 웹 페이지를 만들고 있다. 이런 웹 페이지는 어떻게 만들 수 있을까? 예전에는 HTML의 높이 요소를 측정하여 scroll EventListener를 사용해 많이 구현을 했지만 요즘에는 다른 방법으로 스크롤 애니메이션을 만든다. new IntersectionObserver()라는 기능을 사용하면 편리하게 사용할 수 있다. 이 기능을 사용하면 현재 HTML 요소가 화면에 보이는지 파악하기 쉬워진다. 우선 애니메이션이 보여질 수 있게 기본적인 세팅부터 해보자. 1번째 2번째 3번째 4번째 5번째 우선, 여기에 글자가 나타나면 투명도를 바꿔주는 기능을 추가해보자. 이 기능을 추가하기.. 2023. 1. 16. 이전 1 ··· 9 10 11 12 13 14 15 ··· 57 다음
