리액트8 리액트에 타입스크립트 적용하기 리액트에 어떻게 타입스크립트를 적용하는지 궁금한데,타입스크립트 기본 문법에 이어 관련 내용이 나오는군요. 먼저 '프로젝트 생성하기'부터 시작해서 차근차근 따라가려 합니다.// TypeScript로 프로젝트 생성하기npx create-react-app . --template typescript// src 폴더에서 아래 파일들을 제외하고 모두 삭제src/react-app-env.d.tssrc/reportWebVitals.tssrc/setupTests.ts 커밍 순... 2024. 10. 31. 풀스택 개발에 사용하는 프레임워크, 라이브러리 소개 대학원을 졸업하고 20여 년이 훌쩍 지난 지금...프로그램 개발에 필요한 소프트웨어를 무료로 이용할 수 있다는 게 얼마나 고맙고 신기한 일인지 모릅니다. 저는 대학원에서 전산유체역학(Computational Fluid Dynamaics)을 전공했는데,당시에는 포트란을 이용해 코딩을 했습니다. 소스코드를 구동시키기 위해서는 유료 버전의 프로그램을 사용해야 했는데,쩝... 가격이 만만치 않았습니다. 미국의 경우 NASA의 소스코드를 자국민들에게 무료로 배포하는데, 외국인에게는 배포하지 않았습니다. NASA의 소스코드가 있으면, 실제로 실험하지 않고도 미사일이나 포탄의 비행 등을 무료로 시뮬레이션할 수 있는데...미국이란 나라 정말 부러운걸! 지금 코딩 공부를 하고 있는데... 글쎄 코딩에 사용하는 프로그램을.. 2024. 10. 30. 리액트에서 사용하는 주요 npm 명령어 리액트에서 사용하는 주요 npm 명령어를 정리합니다. // npm 프로젝트 적용: 프로젝트 폴더에서 다음 명령 실행 npm init react-app .// npm 시작npm start// React-Router-Dom 설치npm install react-router-dom@6// classnames 설치npm install classnames// styled-components 설치npm install styled-components// react-query 설치npm install @tanstack/react-query 저는 classnames 명령어를 입력하지 않아 컴파일할 때 오류가 계속 발생하더라고요. 원인은 classnames를 npm으로 설치하지 않아서였는데, 뤼튼의 도움으로 원일을 알게 되.. 2024. 10. 30. Moviepedia & Foodit 프로젝트, 리액트 코드잇 'React로 데이터 다루기' 토픽을 따라 하며 완성한 프로젝트 2가지로하나는 Moviepedia이고, 다른 하나는 Foodit입니다. 따라하기는 했지만, 여전히 리액트는 어렵게 느껴지는군요. 두 프로젝트는 한번 더 복습하면서 코딩을 직접 해봐야겠습니다.^^ Moviepedia : https://github.com/ldh52/React/tree/main/moviepediaFoodit : https://github.com/ldh52/React/tree/main/foodit 2024. 10. 29. 가위바위보 & 주사위 게임, 리액트 코드잇 'React 웹 개발 시작하기' 토픽을 공부하며 만든 프로젝트입니다.토픽 마지막에는 자신이 css와 jsx를 이용해 화면을 구성하도록 되어있는데,아직 혼자 화면을 구성하기에는 부족한 점이 있어,마지막 화면은 좀 더 실력이 붙은 다음에 하는 걸로... 가위바위보 게임은... 컴퓨터와 가위바위로를 하면 이긴 횟수와 승패 여부를 기록주사위 게임은... 승패 여부, 나온 주사위 숫자 기록, 한 번 게임할 때 마다 배점을 주어 누적 점수 계산 등의 기능이 담겨 있습니다. 두 프로젝트 모두 동적으로 웹 개발이 가능한 프로젝트인데요, 따라하기만 해도 재밌고 신기하네요. 가위바위보 게임 : https://github.com/ldh52/React/tree/main/rock-scissor-paper주사위 게임 :.. 2024. 10. 25. 미니 블로그, 리액트 인프런 '처음 만난 리액트(React)' 강의를 듣고 만든 포트폴리오입니다.프런트앤드 미니 블로그인데요, DB와 연계한 listCRUD 기능은 구현되어 있지 않습니다. 블로그 글 목록 보여주기, 블로그 글 작성하기, 댓글 작성하기 등의 기능을 구현하였습니다. 자바로 listCRUD 기능을 구현한 적이 있는데, 리액트를 이용해 이렇게 프런트앤드로 구현할 수도 있군요. 다음에는 자바로 만든 게시판을 포스팅해야겠습니다. 짧은 시간이었지만, 인프런을 통해 리액트를 공부할 수 있어 큰 도움이 되었습니다. 코드잇에서도 강의를 듣고 있는데, 코드잇에는 '주사위 게임' 프로젝트가 있어 곧 만들어 볼 예정입니다. 인프런, 좋은 강의 감사합니다. 깃허브 : https://github.com/ldh52/React/t.. 2024. 10. 23. React 시작! 오늘부터 리액트를 시작했습니다. 자바, 자바스크립트, 파이썬을 공부해서인지 리액트 출발이 좋은데요. 처음에는 인프런 강의를 들었는데, 인프런에서는 실습보다는 리액트의 흐름을 이해하고자 합니다.그런데, 처음 접하는 두려움과는 달리 리액트의 내용이 그렇게 낯설지만은 않군요. 인프런 강의를 들으면서, 코드잇 강의도 시작했는데, 역시 각 사이트만의 장점이 있어,함께 들으니 이해하는데 도움이 됩니다. 오늘도 블록체인 강의 4시간 참여, 내일은 8시간 동안 수업에 온라인으로 참여해야 합니다. 블록체인 강의는 이번 주까지 자바스크립트에 대해 진행됐습니다. 미리 공부해서인지, 이제 자바스크립트 내용이 어렵지 않군요. 조금씩 쌓여가는 내공... 제가 생각해도 신기합니다. 2024. 10. 18. 늦깍이 개발자의 풀스택 로드맵 11월 11일 현재... 'Django'로 풀스택을 개발하기로 결정했습니다. [백엔드]1. 스파르타 / [개발자 입문] 웹개발의 봄, Spring : 바로가기2. 인프런 / 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술 : 바로가기3. 인프런 / 입문자를 위한 Spring Boot with Kotlin - 나만의 포트폴리오 사이트 만들기 : 바로가기4. 수도권 ICT / [바로실습] 생활코딩 - 자바(JAVA) : 바로가기5. 인프런 / 1시간만에 끝내는 spring boot rest api 서비스 소개 : 바로가기 [프론트엔드]1. 코드잇 / 자바스크립트 : 바로가기2. 인프런 / 처음 만난 리액트 : 바로가기3. 코드잇 / 리액트 : 바로가기 [데이터베이스]1. 수도권 .. 2024. 10. 10. 이전 1 다음
