개발 마라톤

부트캠프를 수료하고 약 한 달이 지났다. 대학 전공과 이번 부트캠프를 통해 팀 프로젝트는 경험을 해보았지만, 아직 내 인생에 나 자신만의 개인 프로젝트는 도전해보지 못했다는 것을 깨달았다.. ! 문득 내 머리 속에 있던 작은 망상들이 스쳐지나가고 그 중 하나를 나만의 서비스로 구현해보고 싶어졌다. 나 혼자서 서비스와 디자인을 구상하고, 서비스를 기획하고, 계획하고, 개발하는 것은 어떤 일일지 정말 기대가 되기 시작했다. 프로젝트 개요 나는 예전부터 캐릭터 상품(이하 굿즈)에 관심이 많았다. 가족 구성원에서 미술쪽으로 두 분이나 일을 해서 그런지 그런쪽에 영향을 받은 것 같기도하다. 그런데 굿즈를 구상하고 만드는 상상까지는 즐거웠는데, '어디서 굿즈를 홍보하면 좋지?' 라는 생각이 들었다. 당장 '굿즈 홍..

11052번: 카드 구매하기 (acmicpc.net) 연관 페이지 : 22.10.21/ DP :: 쥔다의 개발 여행길 (tistory.com) DP의 핵심은 '재사용'이다. 구현 방법은 '배열' 이며, 배열의 값을 재사용하는 것을 핵심으로 둔다. ↑DP의 대표적인 예시인 피보나치 수열 F0​=0, F1​=1, Fn+2​=Fn+1​+Fn​ DP 문제인지 파악 ↓ 관계식 만들기 (점화식) ↓ 배열로 변수 정의 ↓ 기저 상태 정의 (가장 낮은 최후 값) ↓ Bottom-Up 반복문 or Top-Down 재귀문 Bottom-Up : 반복문 구현- 아래(기저)에서 누적시켜 전체 큰 문제 해결. Top-Down : 재귀문 구현- n에서 출발하여 기저상태까지 재귀 수행. 알고리즘 : 모든 경우의 수를 확인하여 값을 ..

8. Create https://youtu.be/kctNCMFxciQ 더보기 애플리케이션은 기본적으로 Create, Read, Update, Delete의 4가지 기능을 구현한다. state를 변경할때, 인자를 Object(객체)로 주고 싶다면 단순히 setValue(Object)로 변경을 할 수 없다. 객체를 주기 위해서는 newValue = {...value} (혹은 배열은 [...value] 로 state를 복제한다. 그리고 state를 객체값으로 변경한 후, setValue(newValue)로 설정해주면 된다. 복잡한 이야기지만, 간단하게 객체를 복제 후 수정 한 다음 setValue 해주면 되는 것. topics를 state로 승격시켜서 create기능을 통해 topics를 추가시키면 App()..

6. 이벤트 https://youtu.be/s3cDPbcoy_4 더보기 이벤트를 통해 사용자의 행동에 따라 변화를 나타낼 수 있다. 우선 사용할 컴포넌트(사용자 정의 태그)에 onChangeMode={function(){..}} 이라는 함수를 하나 정의한다. 해당 함수도 역시 props로, 함수를 작성할 때는 중괄호 {}를 통해 작성한다. 태그 정의 함수에서 이벤트를 정의하기 위해서는 html와 같은 onClick 이벤트 속성을 작성해준다. 단, html와 다른 문법을 따르므로, onClick은 대소문자를 확실히 적고 내용은 중괄호 {function(event){..}}를 통해 적는다. 단, event함수는 event객체를 파라미터로 사용한다. props이기 때문에, 사용하기 위해서 props.onCha..

3. 소스코드 수정 방법 https://youtu.be/XQ-XqLVJBwg 더보기 src → index.js 가 메인 화면 은 무엇인가? 해당 태그는 import App from './App' 에서 온 함수이다. 즉, ./App 파일(App.js)에서 불러온 App함수이다. 보면 알겠지만, html형태의 코드가 있음을 확인할 수 있다. html 코드 처럼 수정할 수 있다. 또한, import './App.css'에서 스타일 정보를 받아온다. 개발자 모드로 사이트를 확인하면 기본 정보들이 작성되어있음을 알 수 있다. 이 기본 정보들은 public 폴더 → index.html 에 저장되어 있다. 터미널 종료 : 터미널에서 Ctrl + C 빌드는 종료된 터미널에서 npm run build 후에 build 폴..