TIL

먼길을 돌고 돌아 작성한 코드.. 처음에는 for문으로 문자열을 하나씩 빼주어 배열로 나타내 보자라고 생각했다. 다음으로는 크기비교를 해야함으로 sort로 크기비교를 해주자 까지 생각을 했는데, sort에서 - 또는 + 로 순서를 나열할 수는 있었으나 문자열은 어떻게 비교할 수 있는지 모르고 있었다. 그래서 찾아낸 보다 간단한 삼항연산자로 식을 만들 수 있었다. function solution(s) { return s.split('').sort((a, b) => a > b ? -1 : 1).join(''); } split 매서드를 이용해 배열로 변환 sort 매서드를 이용해 a가 b 보다 크면 -1, a를 b 뒤로 이동 a가 b 보다 작다면 1, a를 b보다 앞으로 이동 그리고 배열나온 값을 join 매..

분명 분명 나는 또 사용할 곳이 있을 것이기 때문에!!!!!!!!!!!!!!!! import React, { useEffect, useState } from "react"; import { Link } from "react-router-dom"; import styled from "styled-components"; import { getAuth, onAuthStateChanged } from "firebase/auth"; export default function Navbar() { const [userMail, setUserMail] = useState(""); const [userProfileImg, setUserProfileImg] = useState(""); useEffect(() => { co..

풀옵으로 전달해주는 값에 따라 다른 리스트 컴포넌트를 보여주어야 했다. 그래서 작성한 코드 export default function ListSection({ text, onClick, category }) { let ComponentToRender = null; if (category === "면접후기") { ComponentToRender = Interview; } else if (category === "취업정보") { ComponentToRender = WorkInfo; } return ( {text} 더보기 {ComponentToRender && } ); } let을 이용해 ComponentToRender 라는 변수의 초기값을 null로 설정\ let ComponentToRender = null..

import { useNavigate } from "react-router"; import styled from "styled-components"; const navigate = useNavigate(); const onClickInterview = () => { navigate("/detail"); }; export default function ListSection({ text }) { return ( {text} 더보기 ); } useNavigate를 사용했더니 위와같은 에러가 발생했다. 그리곤 깨달았다 왜 저러게 작성했는가... 선언문 밖에다가 선언을 해놓았다니ㅋㅋㅋ 다음에 이런에러가 발생하면 안되겠지만 발생하면 다시 내부에 잘 선언해주자 멍청아...

이번 문제를 가져온 이유는 아시는분들은 쉽게 풀었겠지만 for문 하나로 2개의 배열 값을 구할 수 있다는 것을 처음 알았다!!! function solution(a, b) { let num = 0 for(let i =0 ; i < a.length ; i ++){ num += a[i] * b[i] ; } return num } 처음에는 for문을 두개 돌렸는데 두개를 돌리고 보니 이후에 어떻게 해야할지 모르겠어서 찾아보았는데 껄껄껄 이런 이득이... 하나 헷갈리는 부분도 있었다. 배열의 n의 길이를 구할때 n-1을 구해야 한다!! 그러니 for문으로 index 값을 구할때 1

처음 이 문제를 직면했을때 길이를 2로 나누었을 때 0인경우와 아닌 경우, slice를 이용해 자리수를 잘라내면 될 것 같은데 까지는 생각했으나 그 이상으로 무엇을 해야하는지 알 수가 없었다. 초기에 작성해 본 식 function solution(s) { const middle = s.length % 2 if (middle === 0) { } } 그리고 아무생각이 없음... slice를 어떻게 써먹어야하는지.. 이렇게 저렇게 해보았으나 빨간 글자들 뿐..😬 그래서 이번 문제는 chat GPT의 도움을 받아보기로.. 😭 function solution(s) { const middle = Math.floor(s.length / 2); return s.length % 2 === 0 ? s.slice(middl..

1. Router 설정 상세페이지는 동적으로 표현하기 위해 router를 이용해 동적 경로를 이용 import { Navigate, RouterProvider, createBrowserRouter } from "react-router-dom"; import Home from "./components/pages/Home"; import Error from "./components/pages/Error"; import Detail from "./components/pages/Detail"; const router = createBrowserRouter([ { path: "/", element: , errorElement: , }, { path: "/:detail/:id", element: , }, { pat..

이번 과제에서 리덕스를 사용해서 상태 관리를 해야하는데 도대체 왜 사용해야 하는지 언제 어느 부분을 수정하면 좋을지 전혀 감이 오지 않았다. 그래서 알아본 것들을 기록해두고자 한다.😳 1. Redux 사용 시점 여러 컴포넌트에서 공유하는 상태가 많을 때 공유되는 상태가 많고, 이 상태들이 여러 컴포넌트에 걸쳐 있을 때 Redux는 중앙 집중식 상태 관리를 제공하여 코드를 더 깔끔하게 관리할 수 있도록 도와준다. 상태 업데이트 로직이 복잡할 때 상태 업데이트 로직이 여러 단계를 거치거나, 다양한 조건에 따라 상이할 경우 Redux의 미들웨어, 리듀서(reducer) 등을 사용하여 이러한 로직을 체계적으로 관리할 수 있다 상태의 일관성과 예측 가능성을 유지해야 할 때 Redux는 엄격한 규칙을 가지고 상태 ..

Git Commit 메시지 작성 기본 원칙 명확하고 간결하게 commit 메시지는 간결하면서도 변경 사항을 명확하게 설명해야 한다. 제목과 본문 분리 일반적으로 메시지는 제목과 본문 두 부분으로 나뉘고 제목과 본문은 빈 줄로 구분한다. 제목 형식 유지 제목은 대문자로 시작하며, 50자 이내로 제한하고, 끝에 마침표를 붙이지 않아야 한다. 명령어 : git commit -m "제목" 본문 작성 본문에서는 변경 사항에 대한 상세한 설명, 변경의 이유, 추가적인 정보를 제공한다. 본문은 한 줄에 72자 이내로 제한하는 것이 좋다. 명령어: git commit 엔터 이후 본문 작성 명령조 사용 제목은 명령조로 작성하는게 좋다. ex) "Fix bug" 또는 "Add feature" Git Commit 메시지 작..

git status scurce control 가서 수정된 파일, 추가된 파일 하나씩 비교하며 꼭 확인하기 git add . 앞에서 확인한 파일들 전부 추가하기 git pull origin main git에 올라가 있는 파일 당겨오기 ** git pull origin main 하는 이유! 경로확인, 브랜치 확인, 내가 올리기 전에 다른 사람이 수정한 파일이 있는지 확인하기 위해 git commit -m ' ' ** ' ' 안에 들어갈 내용으로는 push 하는 파일에 대한 내용을 간략하고 명확하게 기재해야 한다. ⭐만약 기존 파일을 수정한 것이 아니라 기능을 추가했다면 " Feature: " 라는 키워드 넣어주기 ex) ' Feature: 리뷰기능 추가 ' git push origin 는 push 되어야 ..