개발일기

개요사실 프로그래머스 문제는 그냥 풀고 끝이였는데 요즘 블로그 까지 쓰는 이유는 무엇인가 하면 슬슬 어려워 지기 시작하기 때문이다. 문제 자체가 이해가 안되는 것도 있고, 어떤 식으로 풀어야 할지 감도 안잡히는 문제도 많다. 그렇기 때문에 많이 찾아보고 문제를 풀게 되는데 이런식으로 푸는게 나는 그렇게 도움이 되지 않는다고 생각하지만 정말 아무 생각없이 풀이를 따라한다면 문제가 된다고 생각한다. 그래서 기록하려고 한다. 어려운 문제들을. 문제 설명 정수 배열 arr가 주어집니다. arr의 각 원소에 대해 값이 50보다 크거나 같은 짝수라면 2로 나누고, 50보다 작은 홀수라면 2를 곱하고 다시 1을 더합니다.이러한 작업을 x번 반복한 결과인 배열을 arr(x)라고 표현했을 때, arr(x) = arr(x..

개요프로젝트를 진행하면서 아이콘을 사용하는 부분이 꽤 있다. 근데 보통 아이콘은 svg로 사용하지만 왜 svg로 사용할까? 이참에 svg에 대해 알아보고, 어떻게 적용하는지에 대해 알아보려고 한다.  SVG란?SVG(Scalable Vector Graphics)는 웹 친화적인 벡터 파일 포맷이다. JPEG와 같은 픽셀 기반의 래스터 파일과 달리, 벡터 파일은 그리드 위의 점과 선을 기반으로 하는 수학 공식을 통해 이미지를 저장한다. 해상도, 세부 정보, 품질에 아무런 영향을 주지 않으면서 더 작은 파일 크기로 압축하는 무손실압축 방식을 사용한다. 텍스트로 작성되기 때문에 스크린 리더와 검색 엔진이  해당 텍스트를 분석하므로 접근성과 SEO 측면에서 좋다. SVG 사용하기1. svg 아이콘 사이트 먼저 아..

문제 임의의 문자열이 주어졌을 때 문자 "a", "b", "c"를 구분자로 사용해 문자열을 나누고자 합니다. 예를 들어 주어진 문자열이 "baconlettucetomato"라면 나눠진 문자열 목록은 ["onlettu", "etom", "to"] 가 됩니다. 문자열 myStr이 주어졌을 때 위 예시와 같이 "a", "b", "c"를 사용해 나눠진 문자열을 순서대로 저장한 배열을 return 하는 solution 함수를 완성해 주세요. 단, 두 구분자 사이에 다른 문자가 없을 경우에는 아무것도 저장하지 않으며, return할 배열이 빈 배열이라면 ["EMPTY"]를 return 합니다. 제한 사항 1 ≤ myStr의 길이 ≤ 1,000,000myStr은 알파벳 소문자로 이루어진 문자열 입니다. 풀이funct..

개요그냥 공부하다가 헷갈리고, 개념이 잘 잡히지 않았던 것 같아서 기록하려고 한다. 찾아보니 생각보다 쉬워서 놀랐다. 간단한 예제를 들어 설명 하겠다. 파라미터(Parameter)파라미터는 매개변수라고도 불리며 함수를 정의할 때 사용하는 변수이다. 함수가 호출될 때 전달받을 값을 정의한다. 아래 간단한 예제를 들겠다.//함수 정의function add(a, b) { // a와 b는 파라미터(매개변수) return a + b;}  아규먼트(Argument)아규먼트는 함수를 호출할 때 실제로 전달되는 값이다. 함수가 호출 될 때 파라미터에 전달되는 실제 데이터를 의미한다.아래에 간단한 에제를 들겠다.// 함수 호출let result = add(3, 5); // 3과 5는 아규먼트console.log..

자료구조컴퓨터는 한정적인 공간이다. 이 한정적인 메모리 안에서 데이터를 효율적으로 관리하는게 중요한 문제이다. 데이터를 어떻게 저장하고 메모리 공간을 효율적으로 관리하는지에 대한 고민에서 나온것이 자료구조 이다.  스택한국어로 하면 쌓아 올리다 이런 말 이다. 쉽게 생각하면 어떤 통 안에 물건을 차곡차곡 넣는다고(push) 생각해 보자. 그렇다면 통안에 모든 물건을 꺼낼 때는 어떻게 꺼내야 하는가? 제일 마지막에 넣었던 것부터 역순으로 꺼내야 한다. 그래야지 제일 처음에 넣었던 것을 꺼낼 수 있다.(pop) 스택을 그림으로 나타내면 아래와 같다. 실제 예제 : 함수 호출그렇다면 스택은 어디에 쓰이는 걸까? 우리가 프로그래밍을 할 때 함수 호출을 할 때 정말 많이 쓰인다. 우리가 함수가 실제로 불려서 실행..

문제 정수 n과 정수 3개가 담긴 리스트 slicer 그리고 정수 여러 개가 담긴 리스트 num_list가 주어집니다. slicer에 담긴 정수를 차례대로 a, b, c라고 할 때, n에 따라 다음과 같이 num_list를 슬라이싱 하려고 합니다. n = 1 : num_list의 0번 인덱스부터 b번 인덱스까지 n = 2 : num_list의 a번 인덱스부터 마지막 인덱스까지 n = 3 : num_list의 a번 인덱스부터 b번 인덱스까지 n = 4 : num_list의 a번 인덱스부터 b번 인덱스까지 c 간격으로올바르게 슬라이싱한 리스트를 return하도록 solution 함수를 완성해주세요. 제한사항n 은 1, 2, 3, 4 중 하나입니다.slicer의 길이 = 3slicer에 담긴 정수를 차례대로 ..

문제 입출력 풀이function solution(arr) { var answer = []; if (!arr.includes(2)) { return [-1]; } return arr.slice(arr.indexOf(2), arr.lastIndexOf(2) + 1);} 풀이 내용 문제를 보고 제일 먼저 생각 났던 것은 indexOf와 lastIndexOf, 그리고 slice 이다. 단순하게 2가 위치해 있는 부분을 찾을 수 있는 메서드를 먼저 생각 했고, 부가적인 조건을 클리어 해보니 위의 풀이가 나온 것 같다. 1. 배열에 2가 없는 조건을 먼저 클리어 하기 위해 includes를 사용해서 arr의 배열에 2가 없을 시 [-1]을 리턴 하도록 했다.2. 2와 2사이의 요소들을 가져와야 하기 때..

개요NextJs에서는 2가지의 폰트적용 방법을 제공한다. 첫번째로는 Google Fonts의 방법이고, 두번째는 Local Fonts의 방법이다. 첫번째 방법인 Google Fonts는 NextJs에 내장되어 있어서 간단하게 Import 하여 사용 가능하고, Local Fonts의 방법은 사용하고자 하는 폰트의 woff 파일을 다운받아서 사용하는 방법이다. 공식문서를 참고하면 누구나 다 적용할 수 있지만, 공부도 하면서 차이점도 쓰면서,, 그러려고 한다,, 프로젝트를 진행하면서 두 방법 모두 사용 보았으며, 그것에 대한 기록을 적어두려고 한다. 나는 App Router 방식이 아닌 Pages Router 방식을 사용했다. Google Fonts 적용하기공식문서에서도 나와 있듯이 적용방법은 너무나도 간단하..