본문 바로가기

전체 글62

Next.JS - page directory VS app directory 서론 기존까지 Next.JS를 사용했을 때 (13 Ver 이하) page directory 구조로만 작업했었다. ServerSideProps가 편리했고 폴더 구조 또한 path기반으로 단순했기 때문. 이번에 토이 프로젝트를 만들 때 app directory구조로 만들어 볼까 해서 두 방식에 어떤 차이가 있는지 큰 틀만 간단하게 정리해봅니다. page directory와 app directory의 차이 폴더 구조의 차이 역시 가장 크게 두드러지는 차이는 라우팅 되는 경로를 지정하는 방법이지 않을까? page directory에서는 pages의 하위 폴더 구조 및 파일 이름(index일 때에는 해당 폴더)이 경로 그 자체인데 반해, app directory에서는 app 하위 폴더에서 여러 규칙들(라우팅 그룹.. 2024. 4. 1.
CodeStates | Lunch_club / 2021-05-15 외부일정으로 바쁜게 오랜만이라 익숙치 않았다. 14일(금)날 최종면접을 보고 합격 후 티타임을 가지며 출근날짜와 간단한 개발얘기, 그리고 이런저런 사람사는 얘기를 하다보니 2~3시간이 훌쩍 지나갔다. (참 시간은 빠르다.. ㅠㅠ) 그날 오후엔 동기 수료생분과 티타임을 가지며 이런 저런 담소를 나눈뒤, 간단하게 저녁을 해결하고 전주로 돌아가는 기차에서 꾸벅꾸벅 졸며 돌아왔다. 괜시리 전날 밤 잠도 잘 못자기도 했고, 대표님과 얘기하며 알게모르게 긴장을 했었던 터라 그날 집에 도착해서는 머리가 닿자마자 잠든듯 했다. 일어나자마자 서울에서 지낼 방을 찾아보며 리스트를 만들고, 1시가 다 되어가기에 카페로 향했다. Lunch_club 코드스테이츠 내의 커뮤니티중 하나로 간단하게 식사나 음료를 먹으며 자유롭게 대.. 2021. 5. 16.
프로그래머스 - 오픈채팅방 프로그래머스 - 오픈채팅방 문제 접근 방법 딕셔너리를 활용하여 uid별로 닉네임을 기록한뒤 출입로그를 최종 닉네임으로 나타낸다. 내가 생각한 work flow 닉네임의 변경은 'Enter' 또는 'Change'일 때만 일어나므로 해당 remark가 존재하면 닉네임을 다시 기록한다. Change는 최종출력인 출입로그에 기록되지 않는다. 모든 닉네임 변경과정이 종료된 시점에서 출입로그의 닉네임을 uid에 맞게 작성한다. 완성한 솔루션 JavaScript function solution(record) { // uid를 기준으로 닉네임을 수집한다. // (변경되었다면 최종만) let nicknameList = {}; let greet = { 'Enter': '들.. 2021. 5. 12.
2021.05.04-면접후기 면접질문 이력서가 너무 간단하여 자세한 정보를 부탁한다. 이력서 상에 있는 프로젝트들의 질문. 코드스테이츠에서 배우는 것들(커리큘럼)은 무엇인가? OOP에 관하여 객체지향적 프로그래밍이란 과연 무엇인가. 함수형 프로그래밍에 대해서 아는 대로 설명해달라. 답변 나이, 웹 개발을 공부하기 까지 과정 등을 말씀드림. 각 프로젝트를 진행한 의도를 전달 드리고 (배운 것을 활용하는 것 등등) 어떤 의도로 해당 기능을 도입했는지 등을 설명함. 이력서에 링크로 첨부했다고 답변함. (확인해보니 첨부 안되어있음 ㅠㅠ, 다른 버전의 이력서에 링크되어있음) 상속에 관한 이야기를 중점으로 했었다... 사실 캡슐화라던지 추상화 다형성 등등 객체지향적 프로그래밍은 여러 특성을 가지고 있지만 얼추 어떤느낌이다~ 라는 형태로 기억나.. 2021. 5. 5.
프로그래머스 - 소수찾기 프로그래머스 - 소수찾기 문제 접근 방법 주어진 문자열(숫자로만 구성된)로 생성가능한 모든 종류의 조합(순서를 고려한)을 구한다. 그 조합중 가장 큰 수를 찾는다. 가장 큰 수까지의 소수리스트를 생성한다. 모든 조합을 순회하며 소수인지 확인한다. prime_num_list생성 n까지의 prime_num_list를 생성한다. 단 생성 규칙을 다음과 같이 정한다. 각 index의 위치는 해당하는 정수를 의미한다. 해당 숫자가 소수인지는 Boolean값으로 나타낸다. ex) 숫자 5는 소수인가 -> prime_num_list[5] -> true 모든 조합 생성 주어진 문자열에 대해 1개씩 선택하는 모든 조합부터 문자열의 길이만큼 선택하는 조합까지를 전부 담고있는 리스트를 생성한다.(선택하는 순서를 고려한다.).. 2021. 4. 29.
프로그래머스 - 스킬트리 프로그래머스 - 스킬트리 문제 접근 방법 정규 표현식을 사용해서 주어진 스킬트리와 관련없는 스킬들은 전부 지운다. 남아있는 문자열이 주어진 스킬트리 문자열에서 어느위치에 있는지 확인하다. 주어진 스킬트리가 'ACD'라고 가정하고 이것과 상관없는 모든것을 지운다. 남은 문자열의 상태 및 위치를 파악한다. 이때, 유도되는 결과는 다음과 같다. 빈문자열이 남았다면, 모두 주어진 스킬트리와 관련이 없던 것으로 어떠한 문자열이 왔더라도 정상적인 스킬트리이다. 빈문자열이 아니고, 주어진 스킬트리 문자열에서의 위치가 0번째 라면, 정상적인 스킬트리이다. ex) 'ACD'에서 스킬트리에 의해 배우는 단계는 'A', 'AC', 'ACD'밖에 존재하지.. 2021. 4. 29.
프로그래머스 - 메뉴 리뉴얼 프로그래머스 - 메뉴 리뉴얼 2021/04/23 문제 접근 방법 course의 요소(숫자)마다 모든 문자열을 반복하며 요소(숫자)개를 선택하는 조합을 생성한다. 가장 많이 나온 조합을 기록하고 (동률일 경우 모두) 2번 이상 나오지 않은 조합은 제외시킨다. helper함수 문자열에서 num개 선택하는 조합을 Array로 돌려주도록 한다. 조합선택은 디자인하기 수월하도록 recursion을 도입. 완성한 solution function solution(orders, course) { let answer = []; // amount = 선택할 개수 for (let amount of course) { let temp = {}; for (let i = 0; i < orders.length; i++) { for .. 2021. 4. 23.
프로그래머스 - 괄호변환 프로그래머스 - 괄호변환 2021/04/15 문제 접근 방법 helper함수 '더이상 쪼갤 수 없는 균형잡힌 문자열'과 '남은 문자열'로 나누는 함수를 만든다. '(' 와 ')' 의 수가 같다면 균형잡힌 문자열이다. 올바른 괄호 문자열 올바른 괄호 문자열인지 검증해야 한다. 이어진 괄호를 반복적으로 제거하여 남은 괄호가 있는지 확인하다. 완성된 solution function solution(p) { if (p === '') return ''; let [u, v] = helper(p); // u = 균형잡힌 문자열, v = 남은 문자열 if (isPerfect(u)) return u + solution(v); else .. 2021. 4. 15.
프로그래머스 - 삼각 달팽이 프로그래머스 - 삼각 달팽이 2021/04/14 문제 접근 방법 list의 길이가 1부터 하나씩 증가하는 형태로 n개의 list를 생성한다. 1부터 가장 큰 수까지 방향에 맞게 list에 넣는다. 가장 큰 수 가장 큰 수는 n이 1, 2, 3, 4, 5, 6 일 때 1, 3, 6, 10, 15, 21 과 같이 [초항이 1이며 [초항이 2이고 공차가 1인 '등차수열']을 계차로 갖는 '계차수열']의 n번째 항임을 알 수 있다. Layer class를 만든다. Array를 상속받아 Layer라는 클래스를 만든다. 삼각 달팽이의 각 층을 구성하게 할 것이다. 아래와 같은 기능이 필요하다. 가장 앞에서부터 비어있는(empty)곳에 삽입 가장 뒤에서부터 비어있는(empty)곳에 삽입 .. 2021. 4. 14.