\
[프로그래머스] 3 x n 타일링, JavaScript 풀이
·
📚 STUDY/자료구조 & 알고리즘
문제문제링크 프로그래머스SW개발자를 위한 평가, 교육의 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 제한사항가로의 길이 n은 5,000이하의 자연수 입니다.경우의 수가 많아 질 수 있으므로, 경우의 수를 1,000,000,007으로 나눈 나머지를 return해주세요.입출력 예시n결과411 문제 풀이이런 문제의 접근은 n이 1일때부터 차근차근 접근해야한다.하지만 세로가 3으로 고정되어 있으므로 n이 홀수일 때, 타일을 모두 채우는 경우의 수는 0이다.따라서 우리는 짝수 내용만 고려하면 된다. 그럼 n=2 일 때는 3개로 주어진 예시에서 찾을 수 있다. n=4일 때는 11개로 설명에 나와있다.여기서 주의 깊게 봐야할 점은 n=4일 때, n=2일 때..
디자이너 없이, Claude Design으로 팬 페이지 디자인을 끝낸 3일
·
💻 PROJECT/기술 선택
서론최근 새로운 사이드 프로젝트를 시작했다. 프로젝트 이름은 "맨유허브"로, 맨체스터 유나이티드 축구팀의 팬 페이지이다. 팀은 BE 2명, FE 1명(나) 이렇게 3명으로 구성되어 있는데, 처음에는 Designer 1명을 포함해 4명이었다.진행은 처음부터 순탄치 않았다. 기획 자체는 BE 2분이 주도적으로 진행하는데, Designer 분이 회사 일정으로 인해 시간적인 여유가 없었다. 그러다가 어쩔 수 없이 회사 일정이 빠듯해져 프로젝트에서 하차하는 결정을 내리셨다.와이어프레임도 채 완성되지 않은 상태에서 디자인 업무가 나에게 인수인계되었다. 백수 상태이지만 디자인부터 프론트까지 모두 혼자 담당하는 것이 부담스러웠다. 나 또한 기획에 참여하긴 했지만, 축구에 대한 관심이나 배경지식이 없는 상태에서 시작하여..
AI가 개발자를 대체하는 시대에 어떤 개발자가 되고 싶은가
·
🪵 LOG/개발에 대한 이야기
서론나는 어떤 개발자가 되고 싶은가? 개발 공부를 2~3년 해오면서, 부트캠프도 다니고 사이드 프로젝트도 여럿 진행했지만 정작 "나는 어떤 개발자인가"라는 질문엔 명확하게 답하지 못했다.AI가 코드를 짜고, 혼자서도 서비스를 만들어내는 시대가 됐다. 개발자가 하던 일의 상당 부분을 AI가 대신하고 있다. 그 흐름을 보면서 질문이 더 선명해졌다. AI가 대체할 수 없는 개발자는 어떤 개발자인가. 나는 그런 개발자가 될 수 있는가. 그 생각을 정리해 글로 남긴다. 개발자가 되고 싶은 이유사람들이 나로 인해 편해지는 것 자체가 좋았다. 개발을 시작한 계기는 순수하지 않았다. 학과 동아리 'CIA'에서 캡스톤 대회를 준비하게 됐고, 솔직히 말하면 대회 수상으로 졸업 시험을 면제받고 싶다는 생각이 컸다. 결과는 ..
[Knock/OpenMind] 3G 환경에서 2초 걸리던 렌더링을 100ms로 줄인 과정
·
💻 PROJECT/트러블 슈팅
반응형 레이아웃에서 뷰포트 너비가 바뀌는 순간, 렌더링할 요소 개수가 늦게 재계산됐다. 브레이크포인트를 넘는 순간 잠깐이지만 이전 개수의 요소가 그대로 노출되는 현상이었다.성능 문제는 아니었다. 하지만 상태 계산 시점이 렌더링과 맞지 않는 구조적인 문제였고, 그냥 두기엔 사용자 눈에 직접 보이는 오류였다. 이 글은 그 원인을 찾고 해결한 과정을 기록했다. 문제무엇이 문제였는가반응형 환경에서 뷰포트 너비를 변경하면 약 0.1초 정도 요소가 추가되는데 시간이 걸렸다.원래라면 뷰포트 786px(Tablet size)을 기준으로 보다 클 때 8개, 작을 때 6개가 렌더링 되어야하는데 아래 사진과 같이 렌더링 지연 시간이 보이는 것을 확인할 수 있다. 가설원인을 어디서 찾았는가가장 먼저, 네트워크 환경에 따라 ..
[기술 면접 대비] Front-end 위주로 보는 컴퓨터 구조
·
📚 STUDY/CS & 네트워크
내가 보려고 만드는 기술 면접 리스트문제 리스트CPU와 메모리는 각각 어떤 역할을 하나?프로그램은 어떻게 실행되는가?메모리 계층 구조를 간단히 설명해보세요.캐시 메모리는 왜 필요한가?지역성(Locality)이란?스택(Stack)과 힙(Heap)의 차이는?콜 스택(Call Stack)이란?스택 오버플로우가 발생하는 시점과 이유메모리 누수는 왜 성능 문제로 이어지나요?멀티코어 CPU가 프론트엔드에 주는 이점은?컨텍스트 스위칭이란?무거운 연산이 UI를 멈추게하는 이유Web Worker는 왜 필요한가요? 들어가기 전,컴퓨터 구조라는 과목은, 말 그대로 컴퓨터의 구조와 관련된 학문으로 내가 공부하고 있는 프론트엔드를 넘어 웹 개발자라면 기본적으로 인지하고 있어야하는 내용입니다.따라서, 공부한 내용은 컴퓨터 구조라..
[JavaScript] JavaScript가 동작하는 원리 - 기본편
·
📚 STUDY/WEB
들어가며"호이스팅이 왜 일어날까?", "스코프 체인이란 무엇일까?", "this는 왜 상황마다 달라질까?" JavaScript를 공부해봤다면, 이 질문들은 한 번쯤 생각해보았을 것입니다. 이 세 가지는 따로 외워야 할 별개의 규칙이 아닌, 실행 컨텍스트라는 개념을 이해하면 전부 같은 원리로 설명됩니다.이 글에서는 실행 컨텍스트가 무엇인지, 내부에 무엇을 담고 있는지, 그리고 호출 스택에서 어떻게 동작하는지를 다룹니다.컨텍스트실행 컨텍스트를 이해하기 앞서, 컨텍스트란 무엇인지 이해해야합니다.컨텍스트(Context)란 상황, 맥락, 문맥 상의 의미를 의미합니다. 이를 개발자답게 해석해보면, 텍스트의 내용뿐만 아니라, 텍스트가 사용된 상황, 이전 문맥, 이후 맥락 등을 모두 가지고 있는 데이터 묶음을 가리킨다..