게으른 개발노트

문제 링크 20291번: 파일 정리 친구로부터 노트북을 중고로 산 스브러스는 노트북을 켜자마자 경악할 수밖에 없었다. 바탕화면에 온갖 파일들이 정리도 안 된 채 가득했기 때문이다. 그리고 화면의 구석에서 친구의 메시지를 www.acmicpc.net 문제 설명 친구로부터 노트북을 중고로 산 스브러스는 노트북을 켜자마자 경악할 수밖에 없었다. 바탕화면에 온갖 파일들이 정리도 안 된 채 가득했기 때문이다. 그리고 화면의 구석에서 친구의 메시지를 확인할 수 있었다. 바탕화면의 파일들에는 값진 보물에 대한 정보가 들어 있어. 하나라도 지우게 된다면 보물은 물론이고 다시는 노트북을 쓸 수 없게 될 거야. 파일들을 잘 분석해서 보물의 주인공이 될 수 있길 바랄게. 힌트는 “확장자”야. 화가 났던 스브러스는 보물 이야..

다사다난했던 2022년을 보내면서 처음으로 연 회고를 써보고자한다. 10월에 처음으로 월 회고를 작성하고 데브코스 단위기간 회고도 작성해봤는데 아직도 회고를 쓰기 전엔 많은 생각을 하게 되어서 작성하는데 시간이 좀 걸리는 것 같다. 게다가 1년 동안 내가 뭘 했는지 기록해둔게 없어서 기억을 해내느라 더 걸린 것 같기도하다. 2023년엔 기록하는 습관을 가져야겠다고 생각한다. 생각을 해보다가 월별로 무슨일이 있었는지 쓰는게 더 나을 것 같아서 월별로 적어보려한다. (사실 그렇다 할 일이 몇개 없어서) 1월 ~ 6월 페이퍼리 개발 진행 페이퍼리란? 10월 회고에 어떤건지 대략적으로 써 놓았다. 아무튼 올해 상반기는 매일 사무실 출근해서 경용이형이랑 계속 작업했던 것 밖에 기억나지 않는다. 당장 수익이 나지 ..

문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 신입사원 무지는 게시판 불량 이용자를 신고하고 처리 결과를 메일로 발송하는 시스템을 개발하려 합니다. 무지가 개발하려는 시스템은 다음과 같습니다. 각 유저는 한 번에 한 명의 유저를 신고할 수 있습니다. 신고 횟수에 제한은 없습니다. 서로 다른 유저를 계속해서 신고할 수 있습니다. 한 유저를 여러 번 신고할 수도 있지만, 동일한 유저에 대한 신고 횟수는 1회로 처리됩니다. k번 이상 신고된 유저는 게시판 이용이 정지되며, 해당 유저를 신고한 모든 유저에게 정지 사실을 메일로 발송합니다. ..

CORS CORS은 Cross-Origin Resource Sharing의 약자로 교차 출처 리소스 공유이다. CORS란 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제이다. 쉽게 얘기하자면, 동일한 출처가 아닌 다른 출처에서 데이터를 주고 받는 것을 허용하는 정책이다. CORS의 반대 개념으로는 SOP(Same-Origin Policy) 동일 출처 정책이 있다. SOP 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 보안 방식이다. 즉, SOP는 웹 브라우저에서 보안을 강화하기 위하여 동일한 출처에서만 리소스를 주고 받도록 하는 정책이다. COR..

동기화(Synchronization)란 공유자원의 일관성을 유지하는 것이다. 그렇다면 프로세스 동기화란 여러 프로세스가 공유하는 자원의 일관성을 유지하는 것이라고 볼 수 있다. 프로세스 동기화의 시작은 경쟁 상태(Race Condition)와 임계 구역(Critical Section)에 대한 이해부터 시작한다. 경쟁 상태 (Race Condition) 경쟁 상태란 여러 프로세스들이 동시에 데이터에 접근하는 상황에서, 어떤 순서로 데이터에 접근하느냐에 따라 결과 값이 달라질 수 있는 상황을 말한다. 쉽게 말해서, 다수의 프로세스 혹은 스레드가 동기화 없이 공유 자원에 접근하려는 현상이다. 이런 현상에서 데이터의 불일치 문제를 발생시킬 수 있다. 따라서 일관성을 유지하기 위해 동기화가 필요하다. 경쟁 상태의..

먼저, 리액트에서 리렌더링되는 조건을 알아보자 1. 함수 컴포넌트 자기자신의 상태가 변경될 때 2. 부모 컴포넌트로부터 받은 prop의 상태가 변경될 때 3. 부모 컴포넌트의 상태가 변경될 때 리액트는 이름답게 변화를 감지하여 리렌더링이 되는것이 특징이고, 이런 특징은 빠른 개발속도를 자랑하지만 코드를 잘못 짜면 성능적으로 봤을 때 단점이 될 수도 있다. 예를 들어서 십억번의 연산을 하는 컴포넌트가 있다고 할때, 리렌더링 될 때마다 십억번의 연산을 하게 되면 큰 성능낭비가 될 수 있다. 아래 예제로 확인해보자. 1부터 n만큼의 숫자를 더하고 버튼 클릭을 할 때마다 label뒤에 ":"을 하나씩 붙혀주는 코드다. // App.js import {useState} from "react"; import Sho..

개발하면서 앱이 커질수록 타입체크는 더욱 잘해야하고 타입 검사를 잘 활용하면 많은 버그를 잡을 수 있다. React에는 내장된 타입 검사 기능들을 갖고 있다. 컴포넌트간 데이터를 전달하는 prop에 타입체크를 하는 것은 필수적으로 해줘야 미래의 내가 덜 고생하는 길이 될 수 있다. PropTypes 컴포넌트의 prop에 타입 검사를 하기 위해 prop를 받는 하위컴포넌트에 PropTypes를 선언해준다. import PropTypes from "prop-types"; prop에 유효하지 않은 값이 전달되면 콘솔에 경고문이 보일 것이다. 타입이 다르면 실행을 아예 안시키는 타입스크립트와 달리 자바스크립트에선 실행은 시켜주는 대신 콘솔에 저런 경고문을 띄워준다. 그리고 저 경고문은 propTypes 성능상의..

뭐했다고 벌써 2개월이..? 1차 단위기간 회고 쓴지 얼마 안지난 것 같은데 벌써 2차 단위기간이 끝이다. 😥 저번달에 적응도 했겠다, 확실히 과제도 많아지고 강의 시간도 길어져서 몇배는 바쁘게 지냈던것같다... 사실 어제까지 Vue 과제 부랴부랴 제출하고 이제야 한숨 돌리면서 밀린 회고들을 쓰고 있다. 꿀같은 3일간의 방학(?)을 활용해서 2차 단위기간 회고를 해보고자 한다. 목차 바닐라JS 노션 클론 프로젝트 완성! 과제지옥 CS 기술 면접 스터디 굿바이 재호팀 바닐라JS 노션 클론 프로젝트 🍦 4주차 과제 겸 개인 프로젝트로 지금까지 배웠던 바닐라JS를 활용하여 노션을 클론하는 프로젝트였다. 2주 넘는 시간동안 로토님 강의와 함께 바닐라 자바스크립트 기본 역량 강화를 했고 노션 프로젝트를 하기 위한..