ksw_devlog

타입스크립트 설치 => npm install -g typescript or 1. npm init -y 2. npm install typescript 3. npx tsc --init ---- tsc -w => ts파일을 js로 실시간으로 갱신시켜줌 let 이름 :string = 'kim' 변수를 만들 때 타입지정이 가능합니다. 변수명 : 타입명 이렇게 씁니다. 타입으로 쓸 수 있는 것들은 string, number, boolean, bigint, null, undefined,[], {} 등이 있습니다. let 이름 :string = 'kim'; 이름 = 123; 타입을 지정해놓으면 타입이 의도치 않게 변경될 경우 에러메세지를 띄워줍니다. 덕분에 타입관련 버그들을 사전에 찾아 없앨 수 있습니다. let 이름..

npm install -g => 컴퓨터 전체에 설치 npx tsc --init => tsc 모듈은 한 번만 쓰고 버림 npx tsc -> ts에서 js형식으로 바꿔줌 TS를 JS로 변환해야하는 이유 -> 브라우저는 TS를 이해 못함 출력 때 : npx tsc, node index.js or : npm install -g ts-node 설치후 ts-node ./index TS type 기본 타입의 종류 String Number Boolean Object Array Tuple Enum Any Void Null Undefined Never -> https://likeable-eggnog-5b5.notion.site/3-9c1cd3359dee4039ab3553e7579d11d7 3. 기본 타입 기본 타입의 종류..

리액트 네이티브 프로젝트를 하면서 보낸 한 주였다. 내가 맡은 부분은 OPEN API에서 useQuery를 이용해 정보를 불러와서 사용하는 것과 리뷰댓글 작성,수정,삭제 부분이었다. 이번 프로젝트에선 제공된 튜터님의 코드를 많이 참고하면서 작업을 하였는데 내가 직접 로직을 짜보면서 기능구현을 제대로 못 한게 아쉬웠었다. 물론 CRUD부분은 firebase를 이용하게 돼서 firebase에서 쓰이는 hook를 쓸 수 밖에 없어서 그랬던 것 같다. 프로젝트를 하면서 js 공부를 더 해야겠다고 느꼈고 다음에는 json을 활용하여 CRUD를 구현해보겠다는 생각이 들었다.

KPT 회고록 keep : 팀원들끼리 서로 소통하면서 제공된 튜터님의 강의와 코드를 참고하면서 프로젝트를 진행할 수 있었습니다. problem : 처음에 yarn을 쓰면서 작업하였는데 알 수 없는 오류들이 많아서 결국 yarn에 대한 파일을 삭제하고 npm으로 진행하였습니다. firebase를 활용하여 CRUD 작업을 하였는데 데이터 불러오는 기능을 구현할 때 useEffect에 의존성배열을 잘못 넣어주면서 데이터가 무한루프가 돼서 firebase 서버 무료 사용량이 초과되는 현상을 겪었습니다. CRUD를 구현할 때 제가 직접 로직을 짜면서 구현하고 싶었지만 마땅한 로직을 짜지 못하였습니다. try : 튜터님 코드를 많이 참고하면서 기능을 구현하였습니다. 코드를 보면서 사용한 함수와 어떻게 활용했는지 이..

usequery를 이용하여 사용하는 api 연결 import styled from '@emotion/native'; import { useQuery, useQueryClient } from 'react-query'; import MusicalCard from '../components/Musicals/MusicalCard'; import Loading from './Loading'; import { useState } from 'react'; import { RefreshControl } from 'react-native'; import { getBoxOfficeWeek } from '../api'; import { filterOnlyMusicals } from '../util'; // 모든 공연 페이지..

리뷰 삭제, 수정 -> ReviewEdit.jsx deleteDoc, updataDoc, useMutation 등 이용하였다. export default function ReviewEdit({ navigation, route: { params: { review, from }, }, }) { const [newratings, setNewratings] = useState(0); const [newContents, setNewContents] = useState(''); const isDark = useColorScheme(); const deleteReview = async (id) => { await deleteDoc(doc(dbService, 'reviews', id)); }; const editRev..

리뷰 작성 및 읽어오기 firebase를 이용하여 리뷰 작성하는 기능을 구현하기로 했다. // C - 생성 const [modalContent, setModalContent] = useState(''); const [ratings, setRatings] = useState(0); const getRatings = (rating) => { setRatings(rating) }; const addReview = async () => { //addDoc을 이용해서 내가 원하는 collection에 내가 원하는 key로 값을 추가 await addDoc(collection(dbService, 'reviews'), { contents: modalContent, createdAt: Date.now(), rating..

모달창 만들기 import { Modal } from "react-native" import styled from "@emotion/native" import { useState } from "react" import { Rating } from "react-native-ratings" export default function ReviewModal({isOpenModal, setIsOpenModal}) { const [modalContent, setModalContent] = useState(''); const [ratings, setRatings] = useState(0); const getRatings = (rating) => { setRatings(rating) }; return( 평가 내용 se..