컴맹에 가까운 엄마이지만 아이들과 AI툴을 함께 익혀보겠다는 생각으로 17기 수업을 신청하게 되었습니다. 웹앱과 앱의 차이도 모르는 상태였고, 그냥 “한번 해보자”는 용감함(?)으로 수업에 참여하여 불안했습니다. 그러나 다행히도 성장Peter님의 설명은 초보자의 눈높이에 맞춰져 있었고 막히는 부분을 하나하나 짚어주는 방식이어서 좋았습니다. 첫 시간에는 CURSOR프로그램이 제대로 깔리지 않아 시청만 하다가, 다음날 수업 동영상을 보며 따라해서 웹앱을 완성할 수 있었습니다. 다음은 저의 앱 실현 과정과 시행착오 및 개선 과정입니다.
1. Node.js 미설치 또는 인식 오류
문제: 터미널에
node -v를 입력했을 때'node'는 인식되지 않습니다라는 오류 발생.해결: Node.js 설치 파일에서
"Repair"를 실행하고, VS Code를 완전히 종료한 뒤 재시작.
이후node -v,npm -v를 입력해 정상 인식 확인.
3. Vite 프로젝트 생성 시 기존 폴더 충돌
문제: 기존 폴더가 비어 있지 않아서
"Target directory is not empty"오류 발생.해결: 기존 폴더 이름을 변경하거나 삭제한 뒤 다시 생성 명령어 입력.
4. Vite 프로젝트 설치
명령어 실행 후 질문은 기본값(엔터)으로 통과:
Need to install the following packages?→ Yes템플릿은 자동 지정됨 (
--template react)
5. 프로젝트 폴더 이동 및 패키지 설치
bash복사편집
cd heohaegang-landing npm install
의존성 패키지 설치 완료.
6. 설치 경로 오류
문제:
npm install실행 시package.json이 없다는 오류.해결: 터미널이 잘못된 경로(
project)에 있어서,cd heohaegang-landing명령으로 이동 후 재실행.
7. 개발 서버 실행
arduino복사편집
npm run dev
브라우저에서
http://localhost:5173접속 → 웹앱 정상 실행 🎉
😊 마치며
처음에는 뭘 모르고 시작했지만,
과정 중에 모르는 건 질문하고, 배워가며, 함께하는 수업이라는 점이 정말 좋았습니다.
