본문 바로가기

분류 전체보기403

[ 스파르타 / TIL ] 내일배움캠프 #44 오늘 한 것 알고리즘 문제 풀기 SaveDuck - 달력 가격 입력값 수정 React Native - UI 구현 및 Todo list 아이템 추가 구현 회고 아래 이미지에서 연필(수정)을 누르면 입려한 가격을 수정 할 수 있다. 지금은 가격에 , (쉼표)가 출력 되지만 원래 출력이 되지않았다. 생각보다 여기 파트가 까다로웠던게 comma가 들어가면 string이 되기때문에 무엇을 하던지 string에서 comma를 없애주고 number로 총 합계에 계산을 해주는등 다시 comma를 넣어주어 출력해줘야했다. 모든 구현이 끝나고 setUpdateItemPrice(editPrice)를 넣어줬지만 12,323 숫자가 그래도 12323으로 있었다. 나는 set에 문제가 있는줄알고 그 부분만 보다가 깨달았다... .. 2022. 12. 29.
[ 스파르타 / TIL ] 내일배움캠프 #43 오늘 한 것 알고리즘 문제 풀기 React Native 시작 Expo go 설치 npm을 이용한 Expo 설치 1. 아래의 링크로 회원 가입하기. https://expo.dev/ Expo Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. expo.dev 2. 새로운 프로젝트 만들기 3. 프로젝트 이름 입력하기 4. 명령어 순서대로 설치하기 expo-cli는 쉽게 react native를 개발할 수 있도록 도움을 준다. 아래의 명령어를 설치를 하던 중 npm install --global eas-cli 다음과 같은 에러가 났다. npm ER.. 2022. 12. 29.
[ KTP ] SAVEDUCK 프로젝트 회고 프로젝트 기간: 2022.12.21 - 2022.12.28 프로젝트 S.A. 프로젝트를 마무리 하며 팀원 각자의 회고를 취합했습니다. 김민성 님 KEEP 어려운 것을 알고도 성장하기 위해 기꺼이 범의 굴에 발을 딛는 용기 PROBLEM 초반에 파일 내부 규칙을 조금 더 세밀히 정했다면, 그대로 실현이 되었을까? CAUTION 경험 부족이 가장 크다. 프로젝트에 소요될 시간을 가늠할 수 없었고, 그 기능을 구현하는데 어느 정도의 시간이 소요되는지, 추가적으로 소모되는 시간까지, 경험부족으로 귀결된다. TRY 미리 폴더 구조, 파일 구조를 조금 더 심사숙고해서 나누고, 공통적으로 사용할 것이라 여겨지는 코드를 미리 통일했어도 좋았을 것 FEEL 못 먹어도 고였었고, 역시나 해치우진 못 했다. 다만, 겁도 없.. 2022. 12. 29.
[ 스파르타 / TIL ] 내일배움캠프 #42 오늘 한 것 LOVERDUCK 프로젝트 마무리 및 발표 자료 준비 LOVERDUCK 프로젝트 회고 작성 input값에 maxLength 지정하기 input창에 받는 입력값의 길이를 지정하려고 했지만 잘 되지 않았다. 아래와 같이 길이 제한을 6으로 뒀지만 계속 입력이 되었다. 위의 코드가 유효하려면 input의 type이 'text, search, url, tel, email, password' 일 경우에만 유효하다. 하지만 type이 'number'일 경우에는 유효하지 않았다. 그래서 아래와 같은 방법으로 사용했다. if (inputCost.length > 7) { inputCost = inputCost.substr(0, 7); } Problem 1. React-Redux에 Firebase 연결 및 u.. 2022. 12. 28.
[ 스파르타 / TIL ] 내일배움캠프 #41 Font awsome을 styled componant에서 쓰는 방법 도전 1 아래와 같이 코드를 적어 주었지만 페이지 아무것도 뜨지 않는다. Calendar.js // Calendar.js import styled from 'styled-components'; const PencilIcon = () => { return ; }; export const PencilIconnDisplay = styled(PencilIcon)` font-size: 20px; `; // Calendar.jsx 도전 2 연필 아이콘이 출력된다! // Calendar.jsx import { faPencil } from '@fortawesome/free-solid-svg-icons'; // Calendar.js import styl.. 2022. 12. 27.
[ 스파르타 / TIL ] 내일배움캠프 #40 오늘 한 것 SaveDuck 프로젝트 firebase 연결 SaveDuck 달력 기능 구현 오늘의 배움 firebase와 리액트를 연결하는 과정에서 redux-thunk를 알게 되었다. 그리고 redux에서 가져온 미들웨어 applyMiddlewares를 사용하여 SaveDuck 프로젝트와 firebas를 연결시켰다. 달력 구현에서 어려웠던 부분은 달에 따라 달라지는 날짜였다. 1일이 시작하는 위치가 달르고 윤년해에는 2월의 날짜 수도 달라진다. new Date()로 날짜를 가져오면 1월이 코드에서는 0이다. 이것 또한 잘 생각하며 코드를 짜야했다. 다행히 윤년 계산법을 찾아보고 아래와 같이 코드를 작성해 보았다. const checkLeapYear = (year) => { if (year % 400 =.. 2022. 12. 26.
[ WIL ] 내일배움캠프 8주차 어려웠던 점 날짜 클릭 시 오른쪽에 있는 shopping list에 날짜 업데이트 하기 주로 코드들이 선택권 4가지가 있다면 선택된 버튼의 내용과 같으면 그것을 레더링 되게 했는데 나는 날짜를 클릭하면 업데이트가 되게 해야 했다. useState와 setState를 나름 이해했다고 생각했는데 완벽히 이해한 게 아니었던 것 같다. useState에 같은 것을 레더링 해도 되는지부터 잘 몰랐다. 하지만 가능했다. 해결 방법 1. 처음에 useState에서 를 설정을 해주었다. 2. 날짜가 클릭되었을 때 ShoppingListTag라는 함수에 '오늘날짜'를 넘겨주었다. 3. ShoppingListTag함수에서 '오늘날짜' 구조를 수정해 준 뒤에 return으로 해주었다. Facts Firebase연결 시 버전.. 2022. 12. 25.
[ 프로젝트 ] 내일배움캠프 B-9 LOVERDUCK🐥 S.A. 1. SAVEDUCK 쇼핑 목록들을 기록할 수 있는 플랫폼입니다. 사용자가 날짜별로 목록을 작성하고 목록에서 완료 표시 및 수정, 삭제가 가능합니다. 품목에 따라 가격을 입력할 수 있고 완료된 품목은 총합산 가격을 출력합니다. 2. 와이어 프레임 Figma 링크 Figma Created with Figma www.figma.com 2-1 로그인 / 회원가입 로그인과 회원가입 페이지이며 로그인을 해야지만 프로그램을 사용할 수 있습니다. 2-2 헤더 로그인을 했을 시 보이는 헤더입니다. 2-3 메인페이지 각 날짜별로 쇼핑 목록에 아이템과 가격을 추가할 수 있습니다. 2-4 게시판, 게시글 등록 알뜰하고 스마트한 쇼핑 기록들이 공유되어 있습니다. 2-5 게시글 상세 / 게시글 수정 해당 게시물의 내용을 볼 수.. 2022. 12. 22.
[ 스파르타 / TIL ] 내일배움캠프 #39 오늘 한 것 알고리즘 문제 풀기 Todo list Todo list를 json-server을 사용하여 만들기 리액트와 JSON 서버 연결 오늘의 배움 json-server을 설치하는 것부터 막혔다... 설치하기 위해서 아래와 같이 입력했다. npm json-server --watch db.json 하지만 아래와 같은 에러만 뜨고 db.json 파일이 생성되지 않았다. pm WARN idealTree Removing dependencies.json-server in favor of devDependencies.json-server 알고 보니 npm이 아닌 npx로 설치를 하니 db.json 파일이 생성되었다. 터미널에 아래와 같이 켜지면 json server이 켜졌다는 의미이다. JSON 서버와 통신하기 .. 2022. 12. 22.
728x90