개발일기

전체 동의하기 구현 // 정보동의 체크박스 상태 const [allAgreed, setAllAgreed] = useState(false); // 전체동의 const [agreeChecked1, setAgreeChecked1] = useState(false); // 필수동의1 const [agreeChecked2, setAgreeChecked2] = useState(false); // 필수동의2 const [agreeChecked3, setAgreeChecked3] = useState(false); // 필수동의3 const onAgreeCheckedChange = (checkboxNumber, newValue) => { // 개별 동의 항목이 변경되었을 때의 이벤트 핸들러 switch (checkboxN..

입력 글자수 표시하기 // useState const [aboutMe, setAboutMe] = useState(""); // 소개글 데이터 const [characterCount, setCharacterCount] = useState(0); // 소개글 입력 글자수 // 소개글 : onChange const onChangeAboutMeHandler = (e) => { const newText = e.target.value; setAboutMe(newText); setCharacterCount(newText.length); // 글자 수 업데이트 }; // 화면에 표시하기! {characterCount}/80

회원탈퇴 구현(delete 메서드) delete 메소드 자체가 body를 지원하지 않아, 데이터에 담아서 이렇게 보내야함. // delete 적용방법 axios.delete(url, { data: {} }, config) // delete : 탈퇴 const onClickDeleteSignOutHandler = async () => { try { const response = await SignOutAPI({ data: { email, password }, }); alert("회원탈퇴"); } catch (error) { alert(error.response.data.msg); } }; 참고 https://velog.io/@aszxvcb/DELETE-method-RequestBody-Error https..

.filter로 요소가 있는 item만 뽑기 contents 요소가 없는 경우는 map 적용되지 않음! postList.length > 0 ? ( postList .filter((item) => item.contents) // contents 요소가 있는 item 필터링!! .map((item) => ( .....

카카오톡 공유하기 ① 카카오 sdk 추가 useEffect(() => { const script = document.createElement("script"); script.src = "https://developers.kakao.com/sdk/js/kakao.js"; script.async = true; document.body.appendChild(script); return () => document.body.removeChild(script); }, []); ② 카카오 공유하기 함수 생성 export const shareKakao = (title, postId) => { // url이 id값에 따라 변경되기 때문에 route를 인자값으로 받아줌 if (window.Kakao) { const kak..

로그인 후 페이지 접근 막기 // 로그인 후 로그인 페이지 접근 시 막기 // 액세스 토큰이 있다면(=로그인을 한 상태), 메인 페이지로 보내기! useEffect(() => { if (localStorage.getItem("accessToken")) { navigate("/"); } }, []);