날짜: 2023년 3월 3일 생성일: 2023년 3월 3일 오후 2:51 태그: 프론트 엔드 이 글을 쓰는 이유? 데브 매칭 대비하기 위해 지난해 진행했던, 과제 테스트 해설을 보고 학습한 내용을 정리하려고 합니다. 출제 내역을 보면 SPA(Single Page Application)을 순수 자바 스크립트로 개발하는 문제가 주로 출제 됐습니다. 그렇기 때문에 자바스크립트의 문법을 응용하면서 문제해결을 위해 어떤 문법이 필요한지 알아보겠습니다. 저도 처음부터 알고는 있었지만, “이 문법을 이런식으로 응용해서 사용하면 되는구나” 를 많이 깨달았습니다. 컴포넌트 만들기 SPA는 컴포넌트를 기반으로 개발을 하기 때문에 원래 html의 노드요소들을 Class를 통해서 동적으로 생성해줘야 한다. 따라서 index...

날짜: 2023년 2월 25일 생성일: 2023년 2월 25일 오후 5:12 태그: 프론트 엔드 원티드 프리온보딩 사전 과제를 하면서 react router v6.4에서 좀 많이 바뀐듯한 react router를 사용해봤다. https://reactrouter.com/en/main Home v6.8.1 I'm on v5 The migration guide will help you migrate incrementally and keep shipping along the way. Or, do it all in one yolo commit! Either way, we've got you covered to start using the new features right away. reactrouter.com r..

날짜: 2023년 2월 24일 태그: 프론트 엔드 개발을 진행하다 보면 중복되는 코드와 빈번히 재사용하는 코드를 볼 수 있다. 중복되는 코드를 분리해서 재사용하면 차후 유지보수에도 도움이 되고, 남이 볼 때 쉽게 코드를 파악할 수 있다. 상속과 합성은 객체지향 프로그래밍에서 널리 사용되는 코드 재사용 기법이다. 상속 상속이란? 상속(Inheritance)은 객체들 간의 관계를 구축하는 방법이다. 이 때 객체를 상속받는 객체 클래스는 자식, 상속된 객체는 부모 클래스이다. 클래스 상속을 통해 자식 클래스는 부모 클래스의 자원을 물려 받게 되며, 부모 클래스와 다른 부분만 추가하거나 재정의 함으로 써 기존 코드를 쉽게 확정 할 수 있다. class Animal { // #는 private 접근 제한자 #ag..

개발자로 성장하는데 밑거름이 되어 준 우테코 프리 코스! 여기서 무엇을 배웠고, 어떤점이 좋았는지 글을 작성해보려고 합니다. https://woowacourse.github.io 우아한테크코스 우아한테크코스에서 개발자들을 위해 디자인된 강의를 수강해보세요. woowacourse.github.io 일단 결과부터 말하자면 떨어졌습니다. 웹 프론트엔드 과정에 지원했고, 경쟁률이 1:10 정도 였는데 매우 아쉽습니다. 하지만 배운게 워낙 많았는데, 그걸 한번 정리 해보겠습니다. 1주차 과제 1주차는 온보딩 과제로 알고리즘 문제 7문제를 풀어야 했다. 이때 기본 적인 깃 컨벤션과 깃 사용법을 숙지하고 제출 했어야 했다. 글에서 요구하는 요구사항과 과제 제출 방법을 헷갈려서 기간지키지 못한 pr을 제출했었는데, 한..

정규표현식 정규표현식 만들기 const re = /ab+c/ 정규 표현식 리터럴은 스크립트를 불러 올 때, 컴파일 됨 ⇒ 바뀔 일이 없는 패턴의 경우 리터럴을 사용하면 성능이 향상될 수 있음. RegExp 객체의 생성자 호출. const re = new RegExp('ab+c') 생성자 함수를 사용 → 정규 표현식이 런타임에 컴파일 됨 바뀔 수 있는 패턴이나, 사용자 입력 등 외부 출처에서 가져오는 패턴의 경우 이렇게 사용하세요. 단순 패턴 vs 특수 문자 단순 패턴 /abc/ → 문자열에서 정확한 순서로 “abc” 라는 문자의 조합이 나타나는 부분과 일치함 ex) "Hi, do you know your abc's?” "The latest airplane designs evolved from slabcr..

생성일: 2023년 1월 16일 오후 5:32 태그: 알고리즘 ❔ 동적 계획법 (Dynamic Programming)이 뭔가요? 이 DP 아닙니다.. DP 동적 계획법은 캐시를 사용하는 최적화 기법이다! *Dynamic Programming은 단지 이름이 멋있어서 지은것이며, 실제의미랑은 관계가 없습니다.* 최적화 문제를 연구하는 수학이론에서 왔으며, 처음 주어진 문제를 더 작은 부분 문제들로 나눈 뒤 각 조각의 답을 계산 하고 저장한 뒤에 이 답들로 부터 원래 문제에 대한 답을 계산해 낼 수 있는 최적화 기법입니다. 쪼개진 문제가 두 번 이상 계산이 되는 문제를 부분 문제라고 합니다. 이 부분 문제는 두 개 이상의 문제를 푸는데 사용되기 때문에, 이 문제의 답을 여러번 계산하는 대신 한번만 계산하고 계..