프론트엔드/React15 [ React ] toISOString()를 사용하여 시간 출력하기 toISOString() toISOString()는 Date를 ISOString(yyyy-mm-ddThh:mm:ss) 형식의 문자열로 날짜와 시간 정보를 반환해주는 함수다. 🚨주의 해당 메서드는 UTS(미국) 기준으로 출력되기 때문에 한국시간으로 맞추기 위해서는 3240 * 10000(9시간) 수식을 현재 출력되는 시간에 더해주어야 한다. toISOString() 사용하지 않은 경우 const TIME_ZONE = 3240 * 10000; const date = new Date('2022-12-04 10:20:21'); const formDate = new Date(+date + TIME_ZONE); console.log(formDate); //Sun Dec 04 2022 19:20:21 GMT+0900.. 2022. 12. 4. [ React ] VSCode에서 create-react-app 설치방법, 현재폴더에서 리엑트 설치방법 Visual Studio Code 터미널 열기1. VSCode를 연다. 2. 맥 기준 VSCode를 연후 상단메뉴에서 '터미널' 선택 후 '새 터미널'을 선택한다.쇼트컷으로 control + shift + ` 를 누르면 새 터미널이 열린다. 3. 화면하단에 새로운 터미널 창이 열린다. 4. 프로젝트를 생성하고 싶은 파일 위치로 이동한다.ls : 현제 위치에서의 파일 목록 조회가 가능하다.cd: 원하는 파일을 열고 그곳으로 이동한다. 'ls'를 눌러 현제 위치를 파악한 뒤'cd 파일명'을 적어준다. (파일 루트를 안다면 한 번에 다 적어줘도 된다. Desktop/Code/Frontend) 원하는 파일 위치로 이동했다면 아래 리액트 시작 명령어로 리액트를 설치해 준다. 리액트 시작 명령어 np.. 2022. 11. 30. [React] React에 Redux 적용하기 리덕스(Redux)란? 자바스크립트 상태 관리 라이브러리입니다. 리덕스(Redux)는 Javascript app을 위한 예측 가능한 state container입니다. React 뿐만 아니라 Angular, jQuery, vanilla JavaScript 등 다양한 framework와 작동되게 설계되어있습니다. React에 리덕스(Redux)가 필요한 이유? 리덕스는 action에 반응하여 상태를 변경하기 때문에 리액트 같이 UI를 상태에 대한 함수로 기술하는 프레임워크와 잘 어울리기 때문입니다. 또, 리액트에서 component는 local state를 가지게 되고, 애플리케이션은 global stae를 가지게 됩니다. Redux 장점 상태를 예측 가능하게 만듭니다.(순수 합수를 사용하기 때문) 유지보.. 2022. 10. 18. [React] 리액트, 컴포넌트, DOM 이해 목차 리액트(React)란? 컴포넌트(component) Virtual DOM이란? DOM이란? DOM의 단점 DOM의 사용되는 예시 이를 개선하기 위해서는? 리액트는 실제 DOM에서 어떻게 작용할까? 1. 리액트(React)란? 리액트(React)는 자바스크립트 라이브러리로 사용자 인터페이스를 만드는 데 사용된다. 2. 컴포넌트(component) 리액트 프로젝트에서 특정 부분이 어떻게 생길지 정하는 선언체를 컴포넌트(component)라고 한다. 컴포넌트는 다른 프레임워크에서 사용자 인터페이스를 다룰 때 사용하는 템플릿과는 다른 개념이다. 템플릿은 보통 데이터셋이 주어지면 HTML 태그 형식을 문자열로 반환하는데 이와 달리 컴포넌트는 재사용이 가능한 API로 수많은 기능들을 내장하고 있으며, 컴포넌트.. 2022. 7. 13. [직무 면접 대비] React 인터뷰 질문 1 1. React란?SPA (Single page application -단일 페이지)으로 사용자 인터페이스를 개발하는 데 사용되는 오픈 소스 JS 라이브러리입니다. 2. 리액트 만들고 시작하는 명령어는?npx create-react-app cd npm start 3. Virtual Dom이란?컴포넌트가 다시 렌더링 될 때, virtual Dom은 업데이트할 요소의 목록을 만들기 위해 기존의 DOM 모델에서 변경된 사항을 비교합니다.애플리케이션의 UI를 구성하는 HTML 엘리먼트를 메모리 내에서 구현한 것입니다. 4. JSX란?JavaScript XML의 약자로 HTML처럼 보이는 코드를 작성할 수 있게 해주는 자바스크립트 문법의 확장입니다. 5. Props.. 2022. 2. 17. [React] React란? - 라우터 목차 React란? React-router-dom란? 리액트 라우터 (React Router) 경로 탐색자 (Route Matchers) 내비게이션 (Navigation) 왜 라우터를 쓰는가? 라우터 사용 방법 BrowserRouter 란 뭘까? Router 사용 예시 Redirect Switch 1. React란? React는 자바스크립트 라이브러리로써 SPA(Single Page Application)의 UI(User Interface)를 생성하는 라이브러리이다. 2. React-router-dom 리액트의 SPA (Single Page Application) 방식으로, 여러 개의 페이지를 새로운 페이지로 로드하지 않고 하나의 페이지 안에서 필요한 데이터만 불러와 렌더링 하여 보여준다. react-r.. 2022. 2. 15. 이전 1 2 다음 728x90
