개발하자

안녕하세요. 리액트 초보 입니다! 오늘은 리액트로 페이지 이동 할 수 있게 만들어보려고해요! 나중에 각 메뉴들 만들어서 페이지 이동을 위해서 공부했습니다. 시작하기 전에 Routing 이란? 사용자가 요청한 경로(url)에 따라 다른 화면(view)를 보여주는 것입니다. 리액트 자체에는 이런 기능이 내장되어 있지 않아 라우팅 기능을 위해 react-router를 가장 많이 사용합니다 리액트 시작하기 1. react-router 설치 npm install react-router-dom 설치 후 package.json에서 설치 확인 합니다! 잘 설치가 되었네요 :) 2. routerComponent 구현 2.1. components/routers.tsx import { createBrowserRouter }..

안녕하세요 리액트 + 타입스트립트를 이제 막 공부하기 시작했습니다. 항상 자바스크립트만 사용하다가 타입스크립트를 사용하려니 너무 헷갈리네요... 하지만 차근차근 공부하면서 블로그에 정리해 보려합니다. 아이콘과 버튼은 instructure UI에서 가져와 사용했습니다. Instructure UI instructure.design 예시 import {useState} from 'react' import './App.css' import MyButton from './component/MyButton' // instructure/ui import import {Button, IconCheckSolid, Spinner} from "@instructure/ui"; function App() { const [che..

안녕하세요 리액트 + 타입스트립트를 이제 막 공부하기 시작했습니다. 항상 자바스크립트만 사용하다가 타입스크립트를 사용하려니 너무 헷갈리네요... 하지만 차근차근 공부하면서 블로그에 정리해 보려합니다. 아이콘과 버튼은 instructure UI에서 가져와 사용했습니다. Instructure UI instructure.design 1. test.txs test.txs component를 만들어 Test() 함수에 버튼을 생성하여 표출하였습니다. import {useState} from 'react' /* instructure ui import */ import {Button, IconCheckSolid, Spinner} from "@instructure/ui"; function Test() { /* chec..

안녕하세요 react 공부 2일차입니다. 1일차에서는 node.js 설치, npm 설치, git 연동, tailwindCss 연동을 하고 간단한 테스트를 했었습니다. 오늘은 모든 라이브러리들, 모듈 등 구축되어 있는 환경에서 intelliJ로 간단한 설명을 적어보려 합니다. 구축하는 방법은 아래 링크를 통하여 자세한 방법 확인할 수 있습니다. [NODE] intelliJ + node + git 실행환경 구축 안녕하세요 오늘은 mac에서 git 연결 + node npm + vite + tailWindCss 구축하고 intelliJ로 로컬 실행을 해보려고 합니다. git 설정 1. git Repository 생성 Repository를 구축하면 연결 시 필요한 url를 얻게 됩니다. hayleyun.tisto..