전체 글 썸네일형 리스트형 카페 추천 웹사이트(메인페이지 로그인 팝업, 비밀번호 재설정, 상세페이지 수정요청 버튼) 오늘은 메인페이지에서 회원가입, 로그인만 구현했던 것에 더해서 로그인 팝업에 비밀번호 재설정 기능을 추가하고, 카페 상세페이지에서 수정요청버튼을 누르면 수정내용을 적어서 제출할수있게 구현함 요약메인페이지비밀번호 재설정카페 상세페이지수정요청 버튼 기능 코드를 블로그에 작성했었는데 가독성이 떨어지는 기분이라 Github 주소를 올려두겠습니다. 참고하실분들이 계시다면 참고 해주시면 됩니다. 시연 영상 기능 시연 영상이기 때문에 소리 끄고 보시는걸 추천드립니다.* 음악 틀어놔서 시끄러울 수 있습니다. * Github 주소 (프로젝트)GomTang99/cafeRecommend 더보기 챌린지 9번째 문제 정답 코드 및 해설 n을 7로 나눈 값이 정수 부분만 뗏을때도 같은가 라고 보면은 7로 딱 나눠 떨어진다는 얘기다.그게 아니면 올림을 해야 한다. 이 방법 말고도 Math.ceil이라는게 있는게 그걸 사용해도 된다. 더보기 챌린지 8번째 문제정답 코드 및 해설 입출력 예를 보면 array가 주어지면 n값인 1이 몇개가 있는지 출력하는 것이다. array에서 filter를 사용해서 value가 들어오게 되면 이 value의 값이 n인 경우에만 출력해라최종 결과 값에 length를 추가해서 출력하게되면 정답이 된다. 만약에 문제가 다른 방식인 array안에 들어있는 모든 1의 개수를 세라라고 했으면 좀더 어려운 문제가 된다. [1, 1, 2, 3, 4, 5, 11] 이렇게 array가 주어진다고 하면 1의 개수를 다 세서 총 4개를 출력해준다.이렇게 되면 하나씩 순회하면서 11을 string으로 바꾸면 방법1의 작업을 해주면 된다.(count를 해서 누적해주는 것) 더보기 챌린지 7번째 문제 정답 코드 및 해설 일단 순회를 돌면서 세보겠습니다. array에 filter를 사용한 방법 ex1) [10, 20, 30, 40].filter(v => v > 35)라고 한다면35보다 큰값을 찾아주기 때문에 [40]이라는 값이 나온다. ex2) [10, 20, 30, 40].filter(v => v > 29)라고 한다면29보다 큰 값인 [30, 40]이 나오게 된다. 이것의 length를 출력해준거다. 더보기 카페 추천 웹사이트(마이페이지 즐겨찾기한 목록 기능, 마이페이지 디자인) 저번에 마이페이지 페이지를 만들고 내가 작성한 카페 목록을 보여주는 페이지를 만들었다. 오늘은 저번에 작업한 페이지에 + 즐겨찾기 목록과 마이페이지 디자인을 해보겠습니다. CafeMypage.js코드import React, { useState } from "react";import { useNavigate } from "react-router-dom";import styles from './CafeMypage.module.css';const initialCafes = [ { id: 1, name: "그릿비", region: "울산", category: "뷰맛집", description: "아름다운 바다를 볼 수 있는 카페", isFavorite: true }, { id: 2, name: "롤링.. 더보기 카페 추천 웹사이트(카카오맵 API 환경변수 설정, 마이페이지 컴포넌트 생성 및 css) .env파일에 환경변수를 설정한다. = 뒤에 개인 API키 삽입REACT_APP_KAKAO_KEY=89fd30d4 index.html에 scirpt 추가script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=%REACT_APP_KAKAO_KEY%">script> 카카오맵 지도가 들어가는 페이지 코드CafeDetail.jsimport React, { useEffect, useRef } from "react";import styles from './CafeDetail.module.css';import { Link, useParams, useNavigate } from "react-router-dom";const { kakao } .. 더보기 카페 추천 웹사이트(즐겨찾기 기능) 카페리스트에서 카드칸에 즐겨찾기 기능을 하트모양으로 만들기 CafeList.js코드import React, { useState } from "react";import styles from './CafeList.module.css';import { Link } from 'react-router-dom';import { FaBell } from "react-icons/fa";export default function CafeList() { const [selectedRegion, setSelectedRegion] = useState("all"); const [selectedCategory, setSelectedCategory] = useState("all"); const [showAlert,.. 더보기 챌린지 6번째 문제 코드 및 풀이 numbers를 순회하면서 누적해준다음에 그 누적값을 전체 length만큼 나눠주면 된다. 2. 저번에 풀었던 코드 for문을 사용해서 i가 0부터 numbers.length보다 작을때까지 반복문을 돌리면서 sum에 numbers[i]값을 더해준다. 그리고 answer에 numbers[i]값을 더한 sum에 numbers.length로 나누면 이것도 답이 나온다. 코드의 간결성과 시간복잡도를 계산하면 이번에 푼 코드가 훨씬 더 나을거 같다. 더보기 이전 1 2 3 4 5 6 ··· 8 다음