post-thumbnail

[Test] 프론트엔드 Test Code, TDD 방법론에 대한 생각

Test Code는 소프트웨어 개발에서 코드의 정확성, 품질, 안정성을 검증하기 위해 사용되는 코드이다.이는 주로 단위 테스트, 통합 테스트, 시스템 테스트 등과 관련이 있다.TDD는 소프트웨어를 개발할 때 테스트 코드를 먼저 작성하고, 그 후에 해당 테스트를 통과시키

2024년 2월 2일
·
0개의 댓글
·
post-thumbnail

파이널 프로젝트 회고

작업 기간: 2023.12.26 ~ 2024.01.29업주야놀자 Final Project : B2B Self-coupon Admin(Backoffice) 서비스https://github.com/Upjuyanolja/Upjuyanolja_FEFE: 6명 / BE

2024년 2월 2일
·
0개의 댓글
·
post-thumbnail

미니프로젝트 회고

작업 기간: 2023.11.20 ~ 2023.11.30숙박 예약 서비스사용자는 다양한 숙박들을 찾아볼 수 있고, 예약할 수 있는 사이트.https://github.com/YBEMiniProjectTeam/MINI-Front?tab=readme-ov-file현재

2023년 12월 21일
·
0개의 댓글
·

Redux 사용 정리

initialState: 초기 상태값을 정의하고 타입 지정(ts를 사용할 시 )reducers: 해당 객체내에서 다양한 액션에 대해 함수 정의만약, 함수에 파라미터값을 넣을려면 action으로 파라미터 값을 받고 action.payload를 사용한다.타입은 Payloa

2023년 10월 31일
·
0개의 댓글
·

Redux 설치 및 세팅

컴포넌트가 많을 경우, props drilling 방지불변성 유지모든 컴포넌트에서 state관리store.js / store.tsx 파일 만들기index.js / main.tsx 파일 수정

2023년 10월 31일
·
0개의 댓글
·

프로젝트 기획 저장용

자기소개 페이지 (이력서 페이지)스크롤 이벤트메일 보내기 기능React / TypeScriptBuild: viteStyle: emotioneslint / prettier

2023년 10월 16일
·
0개의 댓글
·

[React] 프로젝트 초기세팅 (개인적 저장용)

리액트 프로젝트를 기본적으로 구성하는 것들을 주로 작성CRA와 Vite 방식으로 프로젝트를 생성할 수 있는데, CRA로 프로젝트를 만들면서 빌드가 매우 느렸던 것을 경험하게 되었다.그래서 Vite를 사용해보니 빌드가 CRA보다 상대적으로 빠르다는 것을 경험하게 되었다.

2023년 10월 3일
·
0개의 댓글
·

[패스트캠퍼스X야놀자] 프론트엔드 개발 부트캠프_JavScript과제 리펙토링

HTML, CSS, JavaScript가독성을 좋게 하기위해 함수로 빼두었습니다.var을 쓰던 버릇이 있어서 몇몇 변수들이 var로 선언이 되어서 let or const로 수정했습니다.비동기 처리를 하는 부분을 then보다는 await를 이용하여 작성하는 것으로 수정했

2023년 8월 28일
·
0개의 댓글
·

[JavaScript] 비동기 패턴: 직렬과 병렬처리 및 안티패턴

무작위 시간이 지나고 data를 반환하도록 하는 비동기 함수입니다.직렬처리는 비동기 작업을 순차적으로 처리합니다.이전의 작업이 완료가 되어야 다음 작업을 시작하는 방식입니다.순서 보장의존성 처리안정성성능 저하병목 현상Promise.all은 내부적으로 비동기 작업을 병렬

2023년 8월 25일
·
0개의 댓글
·

[JavaScript] 비동기 디자인 패턴(Callback, Promise, async/await)

콜백 패턴은 비동기 작업을 다루는 가장 기본적인 패턴이지만, 중첩된 콜백 함수들이 발생할 수 있어 가독성이나 유지 보수성 측면에서 한계가 있을 수 있습니다.이를 해결하기 위해 Promise, async/await 등의 패턴이 도입되었습니다.Promise는 JavaScr

2023년 8월 22일
·
0개의 댓글
·
post-thumbnail

[Java Script] 자바스크립트 동작원리( 동기, 비동기)

Heap: 힙은 동적으로 할당된 메모리 공간으로, 객체와 변수들이 저장되는 곳입니다.JavaScript에서 객체와 배열은 힙에 저장되며, 할당된 메모리 공간은 더 이상 사용하지 않을 때 가비지 컬렉터에 의해 해제됩니다.스택(Stack):스택은 함수 호출과 관련된 메모리

2023년 8월 22일
·
0개의 댓글
·

[JavaScript] 데이터 타입의 종류 및 참조 타입에 대해

원시 데이터 타입은 값 자체가 변수에 저장되며, 변수 사이에 값이 복사될 때 실제 데이터가 복사됩니다. 이러한 데이터 타입은 불변(immutable)하다는 특징을 가지며, 값을 변경하려면 새로운 값을 할당해야 합니다.숫자(Number): 정수와 부동소수점 숫자를 포함

2023년 8월 21일
·
0개의 댓글
·

[패스트캠퍼스X야놀자] 프론트엔드 개발 부트캠프_HTML/CSS 과제 카카오페이지 수정 및 기능추가

https://github.com/YongYong21/clone-coding-kakao원본주소(카카오 페이지) : https://www.kakaocorp.com/page/클론코딩 주소 : https://fantastic-cat-71b104.n

2023년 8월 7일
·
0개의 댓글
·

[프로그래머스] 코딩테스트 [1차] 비밀지도

비밀지도네오는 평소 프로도가 비상금을 숨겨놓는 장소를 알려줄 비밀지도를 손에 넣었다. 그런데 이 비밀지도는 숫자로 암호화되어 있어 위치를 확인하기 위해서는 암호를 해독해야 한다. 다행히 지도 암호를 해독할 방법을 적어놓은 메모도 함께 발견했다.지도는 한 변의 길이가 n

2023년 8월 6일
·
0개의 댓글
·

[JavaScript] for문에 var을 쓰면 안되는 이유

tab-button은 3개이고, tab-content또한 3개이다.이 코드에서는 각 버튼에 클릭 이벤트리스너가 발생되지 않는다.그 이유는 var의 특징 중에 하나인 함수 스코프와 클로저 문제이다.'var' 키워드로 선언한 'i'는 함수 스코프를 가지고 반복문 내에서 생

2023년 8월 3일
·
0개의 댓글
·
post-thumbnail

[정규식]정규식에 대해 알아보자

정규식(Regular Expression)은 문자열에서 특정 패턴을 찾거나 매칭하는 데 사용되는 문자열의 표현 방법입니다. 정규식은 매우 강력하고 유연하며, 문자열 검색, 치환, 추출 등 다양한 문자열 조작 작업에 사용됩니다.양 끝에 있는 /는 시작과 종료를 알려준다.

2023년 8월 1일
·
0개의 댓글
·
post-thumbnail

[프로그래머스]코딩테스트 옹알이1 JavaScript

각 단어가 최대 한번씩 등장포함에 집중해서 includes를 사용하지말고 replace를 사용replace 활용방식에 대해 알 것처음에는 includes를 사용해서 풀려고 시도했으나, 'yee'에 'ye'가 Ture값이 나오다보니 힌트로 replace 활용을 해서 풀었

2023년 7월 29일
·
0개의 댓글
·
post-thumbnail

[WEB] 브라우저가 웹페이지를 읽어내는 과정

이미지 출처: https://hpbn.co/primer-on-web-performance/위 사진은 웹 브라우저가 웹 페이지를 처리하는 과정을 간단하게 표현한 파이프라인입니다.파싱(parsing) 입력 데이터를 읽어들이고 그 구문을 분석하고 해석하는 과정웹 브

2023년 7월 29일
·
1개의 댓글
·
post-thumbnail

[코딩테스트] 백준 2480번 문제 (JavaScript)

구조 분해 할당을 이용해서 변수로 바로 받을 수 있다.Math 메소드를 이용해 Max값을 쉽게 구할 수 있다.

2023년 7월 23일
·
0개의 댓글
·
post-thumbnail

[코딩테스트] 백준 2525번 문제 (JavaScript)

입력값이 이렇게 주어지기 때문에, split('\\n')을 이용해서 받아야한다.구조 분해 할당을 이용해서 변수로 바로 받을 수 있다./ 와 % 를 잘 활용하고 /를 할 시 소수점이 나오는 것을 주의하자.

2023년 7월 23일
·
0개의 댓글
·