그래도 해야지

https://school.programmers.co.kr/learn/courses/30/lessons/120887 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 매개변수로 주어진 i와 j 사이의 연속된 숫자들 중 k 가 등장한 횟수를 return 하는 문제 i가 1이고 j가 13이라고 가정하고, k가 1일때 => 1 ~ 13 중 1은 1, 10, 11, 12, 13 총 6번 등장한다 1. 연속된 숫자를 배열에다가 다 담는다 let arr = [] for(let a = i; a

https://school.programmers.co.kr/learn/courses/30/lessons/120834 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr a는 0, b는 1, c는 2, ..., j는 9로 표현하기 때문에 const alphabetArr = ["a","b","c","d","e","f","g","h","i","j"]; 위와 같이 배열에 a부터 j까지의 알파벳 문자열을 넣어준다 매개변수로 주어진 숫자 age의 각 자릿수를 alphabetArr 배열의 인덱스로 넣어 비교할것이기 때문에 숫자열 age를 문자열로 바꿔준다 ⭐️ 숫자열 =>..

https://school.programmers.co.kr/learn/courses/30/lessons/120886 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문자열 두개가 주어지는데 첫번째 문자열의 문자를 조합해서 두번째 문자열과 동일한 문자열을 만들 수 있으면 1을 리턴, 아니면 0을 리턴하면 된다. 오랜만에 코테 푸는거라 sort 메소드로 두 문자열을 정렬 후 비교할 생각은 못하고 for문 돌리고 if문으로 비교하고 어쩌구 저쩌구 했는데 중복 문자 제거해주고 이런게 좀 골머리였다 여튼 sort 메소드 사용하면 된다고 힌트를 얻었기 때문에 배열에만..

최종 프로젝트 2주차를 마쳤다. 전 프로젝트에선 그렇게 기능구현에 큰 의욕이 앞서지않았는데, 리더라는 자리에 있어서 그런지 안해본 기능구현도 일단 맡고 보고.. 예전보다 더 열심히 기능구현을 하고 있다. 이번에 수파베이스를 사용하면서 과거에 sql 공부했던 지식들도 다시 되새겨봤다. 프론트 개발자로 일을 해도 서버쪽 지식도 필요하다는 점.. ... 이번주에 플젝을 진행하면서 전에 구현해보지 않은 북마크, 필터링 기능을 무난하게 마무리했다. 코드를 짜면서 gpt를 사용해본적이 없는데 이번 프로젝트에서부터 엄청 사용하는 중이다. 방향 잡아주는데 나름 나쁘지 않은 듯..? 수파베이스 db를 사용하면서 초기에 테이블 구조를 신중하게 짜야한다는 사실도 알게되었다. 플젝 진행하면서 계속 구조가 바뀌더라고요 동행페이..

동행찾기 메인페이지에서 전체 게시글 리스트들이 최신순 정렬되어있고, 추가로 국가와 날짜를 기준으로 필터링 기능을 추가하려고 했다. 북마크 기능 구현 했을때,로그인한 유저가 클릭한 해당 게시글을 북마크했는지를 북마크 테이블에서 데이터를 필터링해서 긁어오는 로직을 구현했어서 비슷하게 하면 되겠다 싶었는데 ,,, 필터링하고 싶은 국가와 날짜를 선택하면 해당 값을 state에 넣어주었고, useEffect의 의존성배열에 두 state값을 넣어 두 값이 변경될때마다 서버에 필터링 요청 데이터를 보내 필터링된 데이터를 받아와 뿌려주려고 했다 useEffect(() => { const getfilteredPost = async () => { const filteredPost = await getFilteredPart..

어제 무한스크롤이랑 동행페이지 최신순 정렬 기능 구현 마치고 오늘 호기롭게 뛰어든 북마크 기능 엄청 어려울거라 생각했는데 수파베이스가 또 되게 제공해주는 기능이 많더라고요 은근 생각보다 빨리 구현함 const [bookMark, setBookMark] = useState(false); 우선 북마크 체크 안됨 상태과 체크 됨 상태를 관리해줄 state값을 만들어주고 초기값을 false로 둔다. {bookMark ? removeBookMarkHandle()} /> //체크된 북마크 아이콘 : addBookMarkHandle()} />} //체크 안된 북마크 아이콘 북마크를 보여줄 부분에서 삼항연산자를 사용해 bookMark값에 따라 보여주는 북마크 아이콘을 다르게 설정해주고 클릭을 할 때 상태를 변경해주고 ..

import { useRef } from 'react'; const divRef = useRef(); 예전에 적었던 글 중에 https://loo1o.tistory.com/47 7월 4일 TIL - react ) 무한스크롤 구현하기 (Intersection Observer) 게시글 목록에 무한스크롤 구현하기! Intersection Observer - 화면 상에 내가 지정한 타깃이 보이고 있는지를 관찰할 수 있도록 기능을 제공하는 API - Intersection Observer API를 사용해 화면에 띄어준 콘텐 loo1o.tistory.com 무한스크롤 구현하는거에 관해 TIL을 작성한 적이 있다. 이번 프로젝트에서도 무한스크롤 기능구현 맡게 된 김에 저번에 사용한 방식과 다르게 useInfinite..

아직 마크업밖에 안했기 때문에 보여지는 ui가 웃기긴 하지만 .. 여튼 태그를 선택하면 선택한 태그들이 배열안에 들어가야 한다 그런데 중복 선택에 대한 처리를 안했기 때문에 meal 두번 클릭하면 배열안에 meal이 두번 들어가게 되기 때문에 중복된 값들은 제거해주는 함수를 만들어줘야 했다 찾아보니 방법이 여러개가 있었지만 set을 한번도 사용해 본 적이 없기 때문에 set으로 중복 제거해보기로! const [interestUrl, setInterestUrl] = useState([]); const handleInterestClick = (name: string) => { setInterestUrl((prevInterestUrl) => [...prevInterestUrl, name]); }; 위 태그들이..

Supabase의 interest 테이블 데이터 가져오기 let interestArr; const getInterestsList = async () => { let { data: interest, error } = await supabase.from('interest').select('*'); if (interest) { console.log(interest); return interest; } }; interestArr = getInterestsList(); console.log('interestArr => ', interestArr); getInterestsList 함수는 비동기 함수이므로 함수 내에서 await를 사용하여 Supabase에서 데이터를 가져오고 있다. 비동기 함수 내부에서 받아온 in..

잘한 것은 무엇인가? 드디어 최종 프로젝트주차를 시작했다. 리더로써 부담감이 있었지만 팀원들과 주제도 잘 정했고 기술스택도 너무 욕심부리지 않는 선에서 목표를 잘 정한 것 같다. 아직 해야할 게 산더미지만 해야할 큰 틀을 초반에 잘 잡은 것 같고 .,, 디자이너분과 처음으로 협업하는거라 진행 방식에 차이가 있었지만 나름 서로 의견과 진행 사항을 잘 조율해서 디자인 틀도 잘 잡은 것 같다 잘못한 것은 무엇인가? 정신이 없다는 핑계로 코테도 풀지 못했고.. til도 하나도 안써버림.. 아 담주부터 정신차리겠습니다