림찌의 개발일기 💻

✅ 무엇을 공부했는지 - promise 의 생성 방법 - promise 에서 then, catch, finally 사용법 - 콜백 지옥 함수를 promise 로 변경하기 ✅ 공부한 것에 대한 짧막한 요약 - promise 는 자바스크립트 내장함수이고 exector 라는 콜백함수를 전달해주어야 하는데 이 안에서 성공,실패 두가지 콜백함수를 또 전달해주어야 한다. then은 성공시, catch는 실패시, finally는 성공,실패 상관없이 맨 마지막에 호출된다. 그리고 프로미스 체이닝을 통해 then을 묶어서 비동기적인 처리를 묶어서 처리할 수 있다. catch를 쓰지 않고 에러메세지를 도출하면 unCautgt 에러가 뜨므로 catch를 통해서 잡아야한다. 에러 메세지는 new Error 연산자를 통해 도출..

✅ 무엇을 공부했는지 - 콜백함수, 콜백지옥의 문제점 - js 최대공약수, 최소공배수 구하기 (유클리드 호제법) ✅ 공부한 것에 대한 짧막한 요약 - 콜백함수를 통해 동기, 비동기에 대한 개념을 다시 파악했고 함수 선언시에 이뤄지는 자바스크립트 호이스팅에 대해서도 다시 복습이 됐다. 그리고 콜백 지옥이 얼마나 가독성이 떨어지는가...얼마나 안좋은 코드인가에 대해서도 다시 한번 각인이 됐다. - js 를 통해 최대공약수, 최소공배수를 출력하는 알고리즘 문제에 대해 풀이를 알아보았다. 유클리드 호제법이라는 나누기를 통해 최대 공약수를 구하고, 이렇게 구한 최대 공약수를 통해 최대 공배수도 구할 수 있다는 걸 알았다. ✅ 공부한 것에 대한 느낀점 - 알고리즘 문제에 대한 중요성.... 수학적 개념에 대한 중요..

언제 배웠는지조차 흐릿한 수학 개념을 자바스크립트로 구현해보자... 코테로 나왔을때 이 수학 개념조차 헷갈려서 머리가 어질어질했다... 😭(수포자..집와서 검색해보니 갑자기 기억이 빡 났다) 우선 나처럼 개념을 까먹었었거나 혹시 모르겠다~ 할 수도 있으니 두개의 개념 설명! 최대 공약수 : 두 수 A와 B의 공통된 약수 중에 가장 큰 정수 최소 공배수 : 두 수 A와 B의 공통된 약수 중에 가장 작은 정수 6의 약수 ➡️ 1, 2, 3, 6 12의 약수 ➡️ 1, 2, 3, 4, 6, 12 6, 12의 최대 공약수 ➡️ 6 6의 배수 ➡️ 6, 12, 24, 30, 36 ... 12의 배수 ➡️ 12, 24, 36, 48 ... 6, 12의 최소 공배수 ➡️ 12 이제 javascript 를 이용해 두 ..

react 에서 next.js 를 사용해서 포트폴리오를 제작중인데....로컬 이미지를 가져오는데서 막혔다. next.js 에서 로컬 이미지를 어떻게 가져오는지를 알아보자... --- 우선 next.config.js 파일을 추가한다. const withImages = require('next-images'); module.exports = withImages(); next.config.js 파일을 가장 최상위 루트에 생성하여 다음과 같은 코드를 추가한다. next-images를 install 해주지 않았다면, 우선 설치하자~ 이걸 추가하면 이제 로컬에서 이미지 파일을 import로 불러올 수도 있고, require 로 불러올 수도 있다. - import 로 불러오기 import ExImage from '...

✅ 무엇을 공부했는지 - 함수, 화살표 함수 ✅ 공부한 것에 대한 짧막한 요약 - 자바스크립트 함수에 대해 다시 한번 공부했다. 디폴트 파라미터를 다루는 법을 처음 배운거 같다... function sample(i, a = '디폴트 값 입니다.'){ return console.log(`${i}는 ${a}`); } sample(10); // 결과 : 10은 디폴트 값 입니다. sample(10, '10입니다.'); // 결과 : 10은 10입니다. 디폴트 파라미터의 사용법. 그리고 익명함수, 네임함수, 함수 호이스팅... 등등 주요 개념을 다시 잡았다. - 리덕스 리덕스의 기능을 리액트말고 바닐라 자바스크립트 환경에서 구현해보았다. 리액트 환경이 아니여도 구동이 된다는게 신기했다. ✅ 공부한 것에 대한 느..

난 어느날... 작업을 하다가 git 소스 컨트롤에서 기상천외한 숫자들이 떠있는 걸 목격했다. 내가 한건 파일 하나만 변경한건데, vscode 의 소스컨트롤의 숫자는 600+ 를 넘어가고 있었다. 기겁한 나는 해결방법을 찾았고, 또 이런 일이 반복하는 일이 없도록 기록할것이다 우선 문제의 원인? 만약, 다른 폴더의 파일 변경사항이 뜬다면... 상위 폴더에 git이 설치되어 그 상위 폴더가 연동되어 있을 가능성이 크다. 우선 git 이 어디서에서 연동이 되는 건지 찾아야 한다. 🔍 1. git repository 찾기 git repository를 찾아보자. 그러려면 지금 해당 프로젝트의 터미널에 아래와 같은 명령어를 입력하자. git rev-parse --show-toplevel 그럼 폴더 경로가 하나 뜰..

✅ 무엇을 공부했는지 - 자바스크립트 연산자, 반복문 ✅ 공부한 것에 대한 짧막한 요약 - 산술연산자, 후치,전치 증감,감소 연산자, !연산자 - 관계연산자 - 논리연산자 등등 연산자에 대한 복습. 논리연산자 === 는 타입이 다르면 실행이 안된다는걸 다시 상기했다. - for, while, switch 등등 반복문 공부. switch를 같은 값이라면 축약할 수 있다는 걸 처음 알았다. do while의 사용법도 다시 정리하니 이해가 잘 갔다. 블록을 먼저 실행시키는 일이 어떤 상황일지 아직 겪어보진 않아서 궁금하다. ✅ 공부한 것에 대한 느낀점 - 자바스크립트 개념은 공부하면 알다가도 잠시 쉬면 다시 `개념` 이 헷갈리게 되는 거 같다. 헷갈린다는게 모르겠다는게 아니라 그 개념과 정확한 용도에 대해서 ..

✅ 무엇을 공부했는지 - 자바스크립트 데이터 타입 ✅ 공부한 것에 대한 짧막한 요약 - var, let, const 의 정확한 뜻과 사용법, 차이점 - use static의 중요성 - hoisting ✅ 공부한 것에 대한 느낀점 - 한창 리액트 공부를 하다가 자바스크립트도 다시 한번 정리해보는 시간을 가졌다 개념 정리를 오랜만에 다시 하다보니... 보면 이해는 가고 어떻게 동작하는건 알겠는데, 만약 면접 질문으로 들어온다면 유려하게 말하지 못할거같아서 다시 정리해보았다. 이런 시간을 매일 한두시간 가져도 괜찮ㅇ르듯!

✅ 무엇을 공부했는지 - 리액트 context API ✅ 공부한 것에 대한 짧막한 요약 - context API 를 통한 전역 상태 관리 - createContext 사용법 ✅ 공부한 것에 대한 느낀점 - context API 말고 리덕스를 먼저 접했어서 context API는 개념만 알고 실제 구현을 해본적은 없었다. 실제로 구현을 해보니 나름 편리..한거 같았으나 그래도 리덕스 쪽이 더 편한거 같다. 어쨌든 리덕스도 context API 를 기반으로 만든거니...동적으로 사용하는 context API는 좀 복잡하다고 나는 느꼈다...

✅ 무엇을 공부했는지 - 리액트 최적화 - React.memo의 사용 - useState의 함수화 - useReducer를 통한 최적화 - react-virtualized 사용 ✅ 공부한 것에 대한 짧막한 요약 - react-virtualize 라는 기능...매우 유용한것 같다. 아마 인스타그램에서 쓰는 거 아닐까? 사용자가 보는 화면안에 리스트만 보여주다니...와우.. useState의 함수화에 대해선...다시 한번 더 공부해야할거 같다. ✅ 공부한 것에 대한 느낀점 - 리액트 최적화가 왜 필요한지에 대해 잘 느껴졌던거 같다. 리스트에 체크 한번 하는데 1초 넘게 걸리던게 최적화를 해주었더니 .5 초..? 정도도 안걸리는거 보고 신기했다.