[React] npm start 실행 시 react-scripts 뜨는 오류 해결 방법
·
Stack/React
포트폴리오를 갱신하려고 오랜만에 리액트 플젝을 켰다기억이 안 나서.. 내가 쓴 글을 보며 어찌저찌 실행 성공 > hyojin-portfolio@0.1.0 start > react-scripts start 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 오류 뜸 ..... 해결방법npm install -save react-scripts 요거 해주기 !
[React / Spring 연동] IntelliJ 개발 환경 구축하기 (쉬움 + 자세한 설명)
·
Stack/Spring
1. Spring Initializr에서 스프링 폴더 초기 생성 https://start.spring.io/ Dependencies에 Spring Web 추가 !!! 위와 같이 선택하고 GENERATE 누르면 압축파일이 만들어진다 2. 프로젝트 열기 ~ 압축 해제 후 IntelliJ로 프로젝트가 열리면서 자동으로 빌드가 된다 ! spring Initializer에서 Dependencies에 Spring Web 추가를 했었다 = Spring Web에는 내장톰캣이 있다 = 톰캣을 따로 설치 안 해도 됨 = 서버를 따로 설치 안 해도 됨 = 실행만 누르면 localhost:8080에 뜬다는 말 그 증거는! 오른쪽에 Gradle 눌러서 저기 가보면 tomcat 있다 허허 3. back-end(Spring) 실행..
[React / 스터디] 모두의 일기장 클론 코딩
·
Stack/React
https://github.com/Star-Think/react-today-story GitHub - Star-Think/react-today-story Contribute to Star-Think/react-today-story development by creating an account on GitHub. github.com -- 원본사이트 https://todaysdiary.net/everydiary/ 오늘의 일기 세상에서 가장 재미있는 일기쓰기 todaysdiary.net
[Walking On a Planet] 여행 사이트 구현
·
Project
AWS 돈 너무 마니 나가서 DB 삭제 강행 ..이 사이트는 죽어버렸다 ........... ㅜ ㅜ ㅜ진짜 야심차게 만들었었는데 , , ,나중에 다시 살려줄게 . . . 죽기 전 모습이 담긴 ppt 2022 09 27 다시 살렸다 .. 언제 다시 죽인지 모르겠다 .. https://walking-on-a-planet-client.vercel.app/ Walking On a Planet walking-on-a-planet-client.vercel.app // 320px~479px 반응형 지원
[React] 고객관리 사이트에 이미지 업로드 부분 추가
·
Stack/React
2022.07.21 - [Coding/React] - [React] 고객관리 사이트 (Client) redux로 구현하기 [React] 고객관리 사이트 (Client) redux로 구현하기 2022.07.07 - [Coding/React] - [React] 고객관리 사이트 구현 (Client) [React] 고객관리 사이트 구현 (Client) green_customer_client Header Footer CustomerList Customer DetailCustomer - 라이브러리 설치 a.. 7ingout.tistory.com 2022.08.03 - [Coding/React] - [React] 회원가입 기능 구현 (MySQL / bcrypt / 쿠키) [React] 회원가입 기능 구현 (MySQL..
[React] 회원가입 기능 구현 (MySQL / bcrypt / 쿠키)
·
Stack/React
2022.07.21 - [Coding/React] - [React] 고객관리 사이트 (Client) redux로 구현하기 [React] 고객관리 사이트 (Client) redux로 구현하기 2022.07.07 - [Coding/React] - [React] 고객관리 사이트 구현 (Client) [React] 고객관리 사이트 구현 (Client) green_customer_client Header Footer CustomerList Customer DetailCustomer - 라이브러리 설치 a.. 7ingout.tistory.com 1. MySQL 데이터베이스에 table 생성 2. 서버 구현 1) join 경로 post 요청시 customer_members 테이블에 데이터 추가하기 비밀번호는 암호화하..
[TS / React] redux-thunk Middleware
·
Stack/TypeScript
TS-REDUX-TUTORIAL npm install redux-thunk // 또는 yarn add redux-thunk npm install axios * github로부터 내 정보 받아오기 (server로 사용할 것임) https://api.github.com/users/(githun닉넴) https://app.quicktype.io/ Instantly parse JSON in any language | quicktype app.quicktype.io JSON 포맷으로 만들어주는 사이트 ~ index.tsx import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from '...
[TS / React] typesafe-actions을 이용한 refactoring
·
Stack/TypeScript
https://www.npmjs.com/package/typesafe-actions typesafe-actions Typesafe Action Creators for Redux / Flux Architectures (in TypeScript). Latest version: 5.1.0, last published: 3 years ago. Start using typesafe-actions in your project by running `npm i typesafe-actions`. There are 402 other projects in the npm registry www.npmjs.com https://github.com/piotrwitek/typesafe-actions/issues/143 v5.0.0..
[TS / React] Redux로 To-do List 구현
·
Stack/TypeScript
2022.07.28 - [Coding/TypeScript] - [TS / React] Redux로 Counter 구현 [TS / React] Redux로 Counter 구현 react-redux 1. 모듈리듀서 1) 액션타입 지정 2) 액션생성 함수 3) 초기값 4) 리듀서 함수 작성 -> 루트리듀서 2. 스토어 생성 const store = createStore(루트리듀서) 3.컴포넌트 생성 1) 컨테이너 컴포넌트 2).. 7ingout.tistory.com 초기 셋팅은 위 게시글 참고 ~ TS-REDUX-TUTORIAL modules/todos.ts // 액션타입 선언, 액션 생성 함수, 초기값, 리듀서 // 할 일 추가, 할 일 제거, 할 일 체크 // 액션타입 선언 const ADD_TODO = ..
[TS / React] Redux로 Counter 구현
·
Stack/TypeScript
react-redux 1. 모듈리듀서 1) 액션타입 지정 2) 액션생성 함수 3) 초기값 4) 리듀서 함수 작성 -> 루트리듀서 2. 스토어 생성 const store = createStore(루트리듀서) 3.컴포넌트 생성 1) 컨테이너 컴포넌트 2) 프레젠테이션 컴포넌트 npx create-react-app ts-redux-tutorial --template typescript ts-redux-tutorial npm install redux npm install react-redux ts 안붙어있는 react-redux는 타입스크립트를 모듈에 적용시켜야 함 npm install @types/react-redux * 카운터 만들기 1. 모듈리듀서 -> 루트리듀서 -> combine 2. 컴포넌트 modu..