전체 글

프로젝트 심화 후기 yachaechae/DailyC (github.com)

개요 심화 프로젝트를 진행하면서 서브 이미지를 5개 선택하는 포멧을 작성할려고 한다. 이미지를 선택하는 순간 supabase에 업로드가 되고 결과로 나온 url을 프리뷰 화면으로 보여줄려고 했다. url을 올리면서 name이 지정한 걸로 바뀌기 때문에 배열안에 객체로 보여줘야겠다는 생각을 했다. useState 일단 key에 name을 지정해 주고 다음 key을 두고 value는 빈값으로 넣었다 const [subImgObject, setSubImgObject] = useState([ { name: "subImg1", url: "" }, { name: "subImg2", url: "" }, { name: "subImg3", url: "" }, { name: "subImg4", url: "" }, { na..

여러 객체 받을 때 useState 데이터가 많을 때 하나씩 만드는 것보다 가능하면 객체로 담아서 한번에 돌릴 수가 있다. 모두 똑같은 change 이벤트를 주고 아래처럼 코드 작성 const [inputs, setInputs] = useState({ id: uuidv4(), gender: "woman", height: "", title: "", content: "", }); const handleChange = (e: ChangeEvent) => { setInputs({ ...inputs, [e.target.name]: e.target.value, }); }; 여러 객체 필터링 객체 안에 특정 내용만 넣고 뺄 때 선택된 값을 찾아서 아래처럼 보여줄 수 있다 const toggleActive = (e: ..

1. 프로젝트 개요 프로젝트 인원 : 4 프로젝트 참여자 : 임세현, 서지훈, 윤창근, 윤호준 2. 프로젝트 명칭 DaliyC 3. 소개 한 줄 정리 : 오늘의 외출 코디 공유 내용 : 유행하는 코디를 확인할수 있으며 커플 간 다음날 코디 맞추기, 친구들간 코디 공유를 통해 서로 안겹치게 옷을 입을 수 있습니다. 4. 프로젝트 일정 23/12/26 - 24/01/03 5. 프로젝트 기능 계획 인증 인가 인증 인가 회원가입 로그인 마이페이지 최근 본 카드 내가 만든 카드 북마크 카드 좋아요 카드 코디 카드 오늘 출근룩, 데이트룩, 유행하는 코디를 공유 키에 따른 코디 확인 코디 상세페이지 코디 카드 작성자 구독 좋아요 댓글 카테고리 해시태그별 코디 월별 코디 추가기능사항 날씨, 기온별 코디 (날씨 API ..

문제설명 2016년 1월 1일은 금요일입니다. 2016년 a월 b일은 무슨 요일일까요? 두 수 a ,b를 입력받아 2016년 a월 b일이 무슨 요일인지 리턴하는 함수, solution을 완성하세요. 요일의 이름은 일요일부터 토요일까지 각각 SUN,MON,TUE,WED,THU,FRI,SAT 입니다. 예를 들어 a=5, b=24라면 5월 24일은 화요일이므로 문자열 "TUE"를 반환하세요. 나의풀이 function solution(a, b) { let day = ['SUN','MON','TUE','WED','THU','FRI','SAT']; let date = new Date('2016-' + a + '-' + b); return day[date.getDay()]; }

문제설명 코니는 영어 단어가 적힌 카드 뭉치 두 개를 선물로 받았습니다. 코니는 다음과 같은 규칙으로 카드에 적힌 단어들을 사용해 원하는 순서의 단어 배열을 만들 수 있는지 알고 싶습니다. 원하는 카드 뭉치에서 카드를 순서대로 한 장씩 사용합니다. 한 번 사용한 카드는 다시 사용할 수 없습니다. 카드를 사용하지 않고 다음 카드로 넘어갈 수 없습니다. 기존에 주어진 카드 뭉치의 단어 순서는 바꿀 수 없습니다. 예를 들어 첫 번째 카드 뭉치에 순서대로 ["i", "drink", "water"], 두 번째 카드 뭉치에 순서대로 ["want", "to"]가 적혀있을 때 ["i", "want", "to", "drink", "water"] 순서의 단어 배열을 만들려고 한다면 첫 번째 카드 뭉치에서 "i"를 사용한 ..

타입스크립트 연습하기 https://typescript-exercises.github.io/#exercise=1&file=%2Findex.ts exercises 1 1단계 exercise. users라는 배열있고 이에 맞는 'User`라는 인터페이스 타입 만들어준다. export interface User { name: string; age: number; occupation: string; }; export const users: User[] = [ { name: 'Max Mustermann', age: 25, occupation: 'Chimney sweep' }, { name: 'Kate Müller', age: 23, occupation: 'Astronaut' } ]; export function ..

Typescript로 공부를 본격적으로 들어갔다. Typescript는 javscript의 동적 언어의 문제점을 보완해서 정적인 언어의 모습을 흉내내기 위한 컴파일러라는게 느껴졌다. 앞으로는 모든 작업에 Typescript로 작업을 들어가게 될거 같은데 그 중 Todo-list를 새롭게 적용해봤다. types 우선 todo에 대한 타입을 declare declare type Todo = { id: number; title: string; content: string; isDone: boolean; }; useTodos props로 드릴링하게 된다면 ts에선 어떻게 사용하는게 맞을까란 고민을 하면서 작업을 해봤다. js에선 객체만 남겨주면 됐는데 확실한 타입을 알고 넘겨줘야 할거같다는 느낌을 받았다. ex..

문제설명 오래전 유행했던 콜라 문제가 있습니다. 콜라 문제의 지문은 다음과 같습니다. 정답은 아무에게도 말하지 마세요. 콜라 빈 병 2개를 가져다주면 콜라 1병을 주는 마트가 있다. 빈 병 20개를 가져다주면 몇 병을 받을 수 있는가? 단, 보유 중인 빈 병이 2개 미만이면, 콜라를 받을 수 없다. 문제를 풀던 상빈이는 콜라 문제의 완벽한 해답을 찾았습니다. 상빈이가 푼 방법은 아래 그림과 같습니다. 우선 콜라 빈 병 20병을 가져가서 10병을 받습니다. 받은 10병을 모두 마신 뒤, 가져가서 5병을 받습니다. 5병 중 4병을 모두 마신 뒤 가져가서 2병을 받고, 또 2병을 모두 마신 뒤 가져가서 1병을 받습니다. 받은 1병과 5병을 받았을 때 남은 1병을 모두 마신 뒤 가져가면 1병을 또 받을 수 있습..