전체 글

Algorithm/Algorithm Study
[프로그래머스] 2021 KAKAO BLIND _ 신규 아이디 추천
2021-07-03 알고리즘 문제 풀이 문제 URL : https://programmers.co.kr/learn/courses/30/lessons/72410 코딩테스트 연습 - 신규 아이디 추천 카카오에 입사한 신입 개발자 네오는 "카카오계정개발팀"에 배치되어, 카카오 서비스에 가입하는 유저들의 아이디를 생성하는 업무를 담당하게 되었습니다. "네오"에게 주어진 첫 업무는 새로 programmers.co.kr tmi 종종 프론트엔드 개발자는 백엔드만큼의 알고리즘 능력을 요구하지 않는다. 그렇게 많이 필요한 것 같진않다..라는 말을 듣곤 하는데 코딱지 주제에 내가 감히 뭐라고.. 알고리즘!! 필요없다!!! 옳다!! 그르다!! 할 수는 없는 문제이지만, 일하면서 느낀 게 좀 있었다. 우선 입사한 지 한 달이 ..
→2021.07.03
Today I Learned
[TIL] 2021.05.16 - 부제 : LRU 알고리즘, 버그의 늪, TDD의 필요성
블로그에 꽤나 오랫동안 손을 못대고 있었던 것 같다. 무한 과제 지옥 + 버그 지옥 + 운동 중독 + 그 외 위 4가지 조건이 내 일상을 타임랩스로 만들었다. 입사 후 두달. 짧다면 짧은 시간인데 공적, 사적으로 정말 많은 일들이 있었던 시기가 아니었나싶다. 오늘은 일요일이라 헬스장도 안 열고..비와서 런닝도 못하고..나가기도 싫고..오랜만에 블로깅을 해보려고 한다. 일단 회사에서 본격적인 서비스 리뉴얼 + 서비스 확장의 기간을 보냈는데 (아직 안 끝남) 그 중 제일 기억에 남는 작업이 있었다. 며칠이면 끝낼 수 있지 않나 했던 작업이었는데, 무수히 많은 엣지 케이스, 코드 퀄리티, 알고리즘과의 씨름이었다. 머지까지 약 13일 정도의 기간이 소요되었다. 어떤 작업이었냐 하면, 기존에는 특정 페이지 접속 ..
→2021.05.16
Today I Learned
TIL 2021.03.29 ~ 04.02
TIL이라 쓰고 일기라 읽는다. 사진은 오늘 타코집에서 먹은 비프 치아 어쩌고 블로그는 나한테 일기또는 지식 메모장 같은 느낌이라 그냥 주절주절 의식의 흐름대로 글을 써놓곤 하는데 이상하게 방문자가 많다. 누구세요? 😂😂😂 Code 작성글보다 주절주절 TIL이 더 조회수가 높을 때가 있어서 매우 민망하다. 뭐 하여튼 이번 일주일이 어떻게 지나갔는 지 잘 기억이 안난다. 특정 키워드로 인스타 정보를 크롤링하여 렌더링하는 패이지를 제작했고, 블로그 검색 결과를 react-slick 라이브러리를 사용하여 슬라이드 형태로 렌더링 될 수 있는 코드를 구현했다. 슬라이더 구현을 했던 게 제일 기억에 남는데.. react-slick 은 api 문서를 확인해보면 간단하게 사용할 수 있다. 기본으론 div로 감싸진 엘리..
→2021.04.03
Today I Learned
TIL 2021.03.22 ~ 03.26
입사 후 첫 일주일이 지났다. 일주일 동안 회사 코드를 계속 읽었다. 사실 내내 읽었다기보단 초반 이틀은 서버파일 셋팅에 애를 먹어서 시간을 조금 잡아먹었다. 서버에선 엘릭서를 쓰고있었는데..node, nest만 쓰다가 처음보는 언어의 서버 셋팅을 하려니 이것저것 에러가 넘 많이 났던 것 같은데 결국 다른 분들이 도와주셔서 해결할 수 있었다. 그리고 회사 코드를 읽으면서 계속 놀랐던 것 같다. 그동안 내가 봐왔던 코드들은 구글링해서 나온 잘린 일부 코드들이나, 팀플을 하며 보았던 팀원의 코드가 전부였는데, 실제 서비스를 하고 있는 코드를 보고 있자니 그 양이 실로 방대했고, 코드의 결 자체가 달랐다. 회사에선 typescript, react, tailwindcss, useContext / useReduc..
→2021.03.26
Code/TypeScript
[TypeScript] 타입스크립트의 기본 / 타입(type), 옵셔널 파라미터(optional parameter), 디폴트 파라미터 (default parameter)
타입스크립트의 몇 가지 타입과 특징을 설명하려고 한다. 타입 숫자형 (number type) 문자형 (string type) 비교형 (boolean type) undefined type null type unknown type any type void type object type never type 함수 타입 (function type) 배열 타입 (array type) 이외 타입스크립트, type 연산자를 통한 객체 타입 구체화 타입 추론 옵셔널 파라미터 디폴트 파라미터 | 특수문자를 사용한 or 타입 지정 숫자형 (number type) / 문자형 (string type) let num1: number = 1; let num2: string = 'hello'; num1 = 5 num2 = 'hi' ..
→2021.03.15
Today I Learned
TIL 겸 일기 / 2021.03.13
회사에서 배려해주신 덕에 첫 출근 전까지 2주 정도의 여유 시간이 생겼다. 염색도 하고, 넷플릭스도 보고, 응원해주시고 도와주셨던 분들에게 감사 인사도 전하고, 운동도 강도 높여 하고 있다. 여행을 갈 수 있다면 너무 좋겠지만, 시국이 시국인지라 아무 데도 가지 못하는 게 조금 아쉽다. 무엇을 하며 쉬어야 잘 쉬었다고 소문이 날까 심히 고민을 했는데, 복학을 해서 과제가 폭탄이었다. 고민은 사치였던 것 그리고 아직 근무를 시작한 게 아니기때문에, 부족한 걸 최대한 채우고 싶다는 생각이 계속 들어 이것저것 공부를 조금 해보고 있다. 일단 두 번의 프로젝트를 진행하면서 제일 아쉬웠던 게 있는데 , 서버 배포를 담당한 경험이 없던 것이었다. 프론트엔드여도 기본 배포는 할 줄 알아야 협업을 할 수 있다고 생각이..
→2021.03.14
Code/Nestjs
[Nestjs] NestJS가 각광받고 있는 이유? / 파일 트리 구조 / 실제코드
파이널 프로젝트에서 백엔드를 맡으면서 nestJS를 사용했는데, 골치아팠던 nestJS를 이해하게 되면서 핫할 수 밖에 없는 스택임을 느꼈고, 이를 토대로 기술 발표를 진행했던 적이 있다. 오늘은 nestJS가 핫한 이유, nestjs의 활용과 유용성에 대해 포스팅을 하려고 한다. 포스팅에 앞서 ppt 자료가 포함되었던 발표이기에 간단한 ppt와 함께 nestJS에 대한 설명을 진행할 예정이다. nestjs에 대한 소개와, 사용한 기능 및 느낀 점 총 2가지 포인트로 설명을 할 것이다. NestJS의 특징 첫 번째, 안정성 NestJS는 물론 자바스크립트 js에서도 작동이 가능하지만, nestJS 개발 당시 타입스크립트를 고려하여 제작되었기 때문에 타입스크립트를 적극적으로 지원한다. 타입스크립트를 지원한..
→2021.03.06
Project
[퍼스트 프로젝트 / 리팩토링] weSeason v2.0.0 배포 완료, 리팩토링 회고록
weSeason 소개 시시각각 변화하는 기온과 내 위치! 오늘은 뭘 입을까? 기온에 맞는 옷차림을 추천해드립니다!! 접속 위치와 기온을 확인하고 옷차림을 추천합니다! 현재 기온을 포함한 9시간의 데이터를 미리 확인할 수 있습니다! 원하는 기온 데이터를 클릭하여 옷차림을 확인할 수 있습니다! 다른 곳으로 이동을 해야 한다면? 동네 검색을 이용하여 해당 지역 정보를 확인할 수 있습니다! 구글, 깃허브로 편리한 로그인이 가능합니다! 1. 기획 퍼스트 프로젝트는 2주 정도의 상당히 짧은 기간이었다. 그 중 1주일은 sr을 계획하고, 피그마로 UI, UX를 모두 실사화로 만들어 계획하는 데에 사용했다. 그 후 1주일은 코딩을 진행했다. 첫 번째 프로젝트이고, 내 아이디어가 직접 구체화 되어 구현되는 것만큼 재밌는..
→2021.02.26
Project
[typescript / redux / react] 클라이언트 사이즈 확인, 실시간 리사이징 상태 변경에 대한 삽질 기록
현재 프로젝트를 리팩토링 하면서 새로운 기능을 추가 했는데 이를 구현하면서 생긴 문제에 대해 포스팅하고자 한다. 목적 리팩토링을 하면서 웹 / 태블릿 / 모바일 총 3가지 사이즈로 분기를 해서 구현을 하고 있다. 최종 결과물인 위 움짤과 같이 웹 ui에선 모달로 노출이 되고, 모바일 / 태블릿 ui에선 에러 문구가 노출 되는 기능을 구현하고 싶었다. 해당 페이지의 컴포넌트에서는 변경되는 클라이언트의 사이즈를 실시간으로 확인하고, 사이즈에 맞게 webError 상태, resError 상태( 1024px 이하 모바일, 태블릿) 를 변경하여 노출하는 로직을 생각했다. 클라이언트의 사이즈가 변경될때마다 리듀서에서 관리하는 pageWidth의 상태도 즉시 변경 되길 원했다. 또한 사이즈마다 작동중인 에러가 다른 ..
→2021.02.14
Today I Learned
[프로젝트 리팩토링] 2020.02.10 리덕스에 투자한 핫식스 700ml
첫번째 프로젝트, weSeason 리팩토링을 월요일부터 진행하고 있다. js, react 만을 사용했던 프로젝트이기에 타입스크립트, 리덕스를 사용하고 반응형 구현을 하고싶은 욕망이 컸기때문에, 수료 후 바로 리팩토링 기획을 시작했다. 반응형 UI는 웹, 태블릿, 모바일로 디자인도 수정하고 새로 만들었고, 태스크 분배도 v1.0.0에서 맡았던 부분이 아니라, 1차 프로젝트때 프론트엔드에서 서로 맡았던 부분을 바꿔서 진행하고 있다. 그렇게 어제부터 노마드코더에서 리덕스 강의를 수료하고, 계속 공식문서와 구글링을 하고 있는데...... 될 듯 하면서 안되고, 이해될 것 같으면서도 안되고있다. 사실 오늘 내내 회원가입 페이지 css를 90%정도는 구현했는데 예전 같았으면 분명히 분기처리로 컴포넌트를 나눴을 파트..
→2021.02.10
Project
[4주 프로젝트] soundWave / 백색 소음과 음원을 조합, 플레이 리스트 만들기 / 프로젝트 회고록
2021.01.06 ~ 2021.02.02 [파이널 프로젝트 4인/4주] 첫 번째 프로젝트 이후 쉴틈 없이 바로 진행된 파이널 프로젝트가 끝이 나 회고를 작성하려고 한다. 다시 한 번 또 같이! 프로젝트 진행 하기 전 개인 별로 모두 선호, 비선호 팀원에 대한 설문조사를 진행하고 최대한 니즈에 맞춰 팀 매칭이 진행된다. 첫번째 프로젝트 당시 마지막에 팀원 분들과 여기서 누구하나만 따로 분리되는 거 아니냐며, 그렇게 되더라도 어색한 티 내지않기로 했다. 근데 두둥! 다시 한 번 모두 같은 팀이 되었다. 사실 처음엔 걱정이 좀 되었다. 워낙 첫번째 프로젝트 당시 분위기도 좋았고 결과물에 대한 만족도가 높아서 다들 기대치가 너무 높아지면 실망이 크지 않을까...했는데 결과적으로 끝난 시점에서 얘기하자면!! 역..
→2021.02.04
Project
[퍼스트 프로젝트] 떨리고 설렜던 주니어 프론트엔드 개발자의 첫번째 프로젝트 회고
2020.12.21 ~ 2021.01.02 (2주 프로젝트) 코드스테이츠에서는 프로젝트 시작 직전 HA 테스트를 본다. 그 바로 전날에는 인증 스프린트가 진행되었는데 이때 기분은 마치 찬물을 한바가지 맞은 느낌이었다. 뭐? 쿠키? 세션? 토큰? 근데 ? 오어스도? 휘몰아치는 인증을 겨우 끝내고 나니 HA가 있었다. HA도 꽤나 오랜 시간 붙잡고 있었기에 심적으로 지친 상태였는데 다행히도 프로젝트를 진행할 수 있게 되었다. 프로젝트를 진행하기 전에 조금 떨리는 상태였는데.. 그때는 인증이 어렵다고 느껴져서인지 서버에 대한 자신감이 떨어져 있던 상태였다. 프론트엔드 백엔드 둘 다 두번의 프로젝트 기간동안 한 번씩 해보고 싶었기때문에 첫 프로젝트에서는 프론트엔드를 맡았다. 그렇게 역할을 정하고 아이디어 회의를..
→2021.02.04
개발 일기
어려운 백엔드
첫 프로젝트에서 프론트엔드를 담당하면서 나름 만족스러운 결과물로 마무리했다. 두번째 프로젝트에서 백엔드를 맡게 되었는데.. 그동안 기본 js / nodejs / express / sequelize 스택으로만 진행을 하다가 두번째 프로젝트이기에 백엔드에 모두 신규 스택을 사용하기로 했다. 1 . 타입스크립트 2. nestJS 3. typeorm 타입스크립트? 오케이 공부하다 보니 좋은 것 같고 계속 사용하면서 손에 익히면 다신 js로 돌아가지 않을 것 같은 느낌이 있었다. 네스트js? 컨트롤러 작성할 때 상당히 골치아프고 아직 어떻게 분기를 해야할 지 모르겠지만 이것도 한 번 해보면 좋을 것 같은 느낌. typeorm? 오 자동 마이그레이션 좋고, 모델 생성 깔끔하고 만족. 근데 이번 프로젝트에서는 일반 ..
→2021.01.20
Code/JavaScript
자바스크립트 / this 바인딩의 5가지 패턴 정리 (메소드 호출, call, apply ...)
아직도 코린이지만 정말 배운 지 얼마 안 된 코코코린이 시절에 this를 처음 접했을 땐 당최;; call ? apply? 생성자? 응? 머리에 남는 게 없었다. 그러다 과제를 계속 진행하면서 실제로 this를 사용하고 구체화시키면서 this에 대한 감이 조금은 잡혔으나, 개념적으로 부족한 부분이 있는지 되짚어보고자 오늘은 this에 대해 포스팅을 하려고 한다. 우선 자바스크립트의 경우에는 this가 명확하게 딱 이것이다!로 정의되어 있는 것이 아니다. 사용 패턴에 따라 바인딩 되는 this가 다르다는 것을 알고있어야 한다. Execution Context 자바스크립트 내에서 함수를 실행 시 execution context 마다 this가 생성된다. 이때의 this는 함수를 실행 할 때 호출 방법에 따라..
→2020.11.01
Today I Learned
2020.10.31 TIL 해피 할로윈!
해피 할로윈! 그냥 주말이라 평소처럼 카페 가서 공부하는데 깃허브가 느닷없이 노랑색이길래 보니까 할로윈이었다. 깃허브가 할로윈을 알려주다니 ㅋㅋㅋㅋㅋㅋ ㅠㅠ 😂😂 공부한다고 문명과 단절된 삶을 살고 있던 건가하고 잠깐 생각했다 ㅋㅋㅋㅋㅋ 어제부터 아침 9시~10시 동안 알고리즘 문제 1개를 푸는 시간이 주어졌는데 제 시간안에 다 풀지 못했다. 입출력 예시를 생각하면서 주석을 열심히 써내려가다 보니 40줄을 써놨더라는 ㅠ 오늘 그 문제를 다시 열어서 주석을 모두 지우고 다시 생각을 해보기로 했다. 그렇게 삼십분이 지났나 뇌가 굳은 것처럼 머리가 안 돌아가는 것 같아서 예전에 풀었던 알고리즘 문제 20개를 다시 풀었다. 이 문제들을 처음 풀 땐 정말 눈물이 나도록 어려웠고 머리에서 열이 엄청 났었다. 일주일..
→2020.10.31

• 이전
• 1
• 2
• 3
• 4
• 5
• 6
• 다음