post-thumbnail

단 몇 줄로 구현하는 무한 스크롤 : NYT API로 뉴스 기사 검색 웹 페이지 만들기 2

scroll... new IntersectionObserver... 그게 뭔데...

2022년 6월 16일
·
0개의 댓글
post-thumbnail

Firebase GoogleAuthProvider 외않됨;;

React 환경에서 Firebase GoolgeAuthProvider()를 사용해 구글 아이디로 회원가입 코드를 작성하던 중 아래와 같은 에러 메세지가 발생했다.환경변수 설정 문제로, .env와 그것을 받는 파일에서 오타가 있어서 발생한 오류. React 환경에서는 환

2022년 6월 5일
·
0개의 댓글
post-thumbnail

5월 4주차 코딩테스트 문제 풀이 리뷰

행렬의 덧셈은 행과 열의 크기가 같은 두 행렬의 같은 행, 같은 열의 값을 서로 더한 결과가 됩니다. 2개의 행렬 arr1과 arr2를 입력받아, 행렬 덧셈의 결과를 반환하는 함수, solution을 완성해주세요.행렬 arr1, arr2의 행과 열의 길이는 500을 넘

2022년 5월 29일
·
0개의 댓글
post-thumbnail

JavaScript 콜라츠 추측

1937년 Collatz란 사람에 의해 제기된 이 추측은, 주어진 수가 1이 될때까지 다음 작업을 반복하면, 모든 수를 1로 만들 수 있다는 추측입니다. 작업은 다음과 같습니다.입력된 수, num은 1 이상 8000000 미만인 정수입니다.입출력 예 문제의 설명과 같습

2022년 5월 28일
·
0개의 댓글
post-thumbnail

React & Redux로 로그인 웹페이지 만들기

Megabyte School React 과정에서 API를 통해 가져온 정보로 로그인 페이지를 만들어보는 실습 과제를 수행했다. API를 사용하는 방법은 독학이나 이번 과정에서 몇 번 해봤지만 아직까지 마냥 막막하고 손에 익지 않은 것 같다. 이때문에 이번 과제를 수행

2022년 5월 28일
·
0개의 댓글
post-thumbnail

최고 리덕스야 고맙다! Redux & Redux Toolkit 알아보기

리덕스는 상태 관리 라이브러리 중 하나로, 현재까지 가장 많이 쓰이고 있다. 상태 관리란 UI와 UX에 맞게 데이터를 관리하거나, 서버와 주고 받는 데이터를 관리하는 것을 말한다.간단한 프로젝트라면 괜찮겠지만, 복잡하고 크기가 큰 대형 프로젝트라면 상태 관리의 난도는

2022년 5월 25일
·
0개의 댓글
post-thumbnail

훅. 후훅. 리. 리액트 훅. 후훅. 훅. 리. 리액트 훅 알아보기

React 16.8버전부터 새롭게 추가된 Hook은 기존 class를 사용하지 않고, React state와 lifecycle features를 연동할 수 있게 해주는 함수다.기존 class를 사용한 React는 코드의 재사용성이 낮고, 작성하기 까다로우며, reloa

2022년 5월 24일
·
0개의 댓글
post-thumbnail

JavaScript 자릿수 더하기

자연수 N이 주어지면, N의 각 자릿수의 합을 구해서 return 하는 solution 함수를 만들어 주세요.예를들어 N = 123이면 1 + 2 + 3 = 6을 return 하면 됩니다.N의 범위 : 100,000,000 이하의 자연수입출력 예 문제의 예시와 같습니다

2022년 5월 13일
·
0개의 댓글
post-thumbnail

5월 2주차 코딩 테스트 문제 풀이 리뷰

문자열 s는 한 개 이상의 단어로 구성되어 있습니다. 각 단어는 하나 이상의 공백문자로 구분되어 있습니다. 각 단어의 짝수번째 알파벳은 대문자로, 홀수번째 알파벳은 소문자로 바꾼 문자열을 리턴하는 함수, solution을 완성하세요.문자열 전체의 짝/홀수 인덱스가 아니

2022년 5월 13일
·
0개의 댓글
post-thumbnail

JavaScript 직사각형 별찍기

이 문제에는 표준 입력으로 두 개의 정수 n과 m이 주어집니다.별(\*) 문자를 이용해 가로의 길이가 n, 세로의 길이가 m인 직사각형 형태를 출력해보세요.n과 m은 각각 1000 이하인 자연수입니다.

2022년 5월 11일
·
0개의 댓글
post-thumbnail

JSON 파일 데이터 가져와서 리스트 만들기

패스트캠퍼스 메가바이트스쿨 프론트엔드 개발자 과정의 첫 토이 프로젝트는 금융앱 만들기였다.대충 아래와 같은...대충 자바스크립트와 CSS로 슬라이드와 슬라이드 그리고 슬라이드를 만드는...그런데 JSON 파일 데이터를 추출하는 건 배운 적이 없는데?...도와줘잉아래의

2022년 5월 11일
·
0개의 댓글
post-thumbnail

너의 할 일은。React로 To Do List 만들기

ReactJS로 To Do List 만들기input 입력 값 15자로 제한하기To Do List 삭제하기To Do List 10개로 제한하기input창에서 onChange를 사용해 입력된 값을 toDo와 setToDo를 이용해 받는다. form 태그에 쌓여진 butto

2022년 5월 2일
·
2개의 댓글
post-thumbnail

JavaScript 핸드폰 번호 가리기

프로그래머스 모바일은 개인정보 보호를 위해 고지서를 보낼 때 고객들의 전화번호의 일부를 가립니다.전화번호가 문자열 phone_number로 주어졌을 때, 전화번호의 뒷 4자리를 제외한 나머지 숫자를 전부 \*으로 가린 문자열을 리턴하는 함수, solution을 완성해주

2022년 5월 1일
·
0개의 댓글
post-thumbnail

왜 콘솔로그가 두 번 출력되지? 왜 콘솔로그가 두 번 출력되지? : React StrictMode

평화로운 React 공부시간. React 앱을 환경에서 분명 아래와 같이 console.log()를 한 번 작성했는데 개발서버 화면에서는 두 번 출력되고 있었다. 이런 현상은 StrictMode 때문인데, React 환경에서 작성한 코드를 출력하기 위해 만든 ind

2022년 4월 29일
·
2개의 댓글
post-thumbnail

ReactDOM.render는 React18에서 지원되지 않습니다.

npx를 이용해 React 앱을 만든 뒤 index.js에서 ReactDOM.render()를 실행했을때 다음과 같은 경고 메세지가 콘솔창에 뜨는 것을 발견.Warning: ReactDOM.render is no longer supported in React 18. U

2022년 4월 28일
·
0개의 댓글
post-thumbnail

무한으로 즐기는 JavaScript 슬라이드 만들기 : 무한루프&자동변환

이전 글 코드 간소화하기.이전 글 슬라이드를 무한루프로 변경.이전 글 슬라이드에 자동변환 기능 추가.이전 글 슬라이드 코드에서 슬라이드를 실행하는 부분을 따로 함수로 빼내어 작성했고, transition 기능을 CSS에서 빼내어 move() 함수에 추가했다.무한루프를

2022년 4월 27일
·
3개의 댓글
post-thumbnail

JavaScript 슬라이드 만들기

슬라이드 끝부분에서는 슬라이드 이미지가 빈 화면으로 넘어가지 않게 하기n개의 슬라이드를 넣어도 별도 수정없이 동작 가능하게 하기다양한 크기의 이미지를 넣어도 별도 별도 수정없이 동작 가능하게 하기하나의 함수로 버튼 두 개를 관리하기하나의 함수로 버튼을 설정하라는 조건이

2022년 4월 25일
·
2개의 댓글
post-thumbnail

JavaScript reduce로 평균 구하기

정수를 담고 있는 배열 arr의 평균값을 return하는 함수, solution을 완성해라.제한사항arr은 길이 1 이상, 100 이하인 배열이다.arr의 원소는 -10,000 이상 10,000 이하인 정수입출력 예시길이 1 이상, 100 이하 배열인 arr의 값을 모

2022년 4월 23일
·
1개의 댓글
post-thumbnail

나.리액트.쓰는데.내.동년배들.다.JSX.쓴다.

JSX(Javascript XML)은 함수 호출과 객체 생성에서 문법적 편의를 제공하는 Javascript의 확장된 구문이다 . JSX는 React.createElement()를 반복적으로 호출해야하는 불편을 해소할 수 있으며, Javascript의 모든 기능을 쓸 수

2022년 4월 23일
·
0개의 댓글