전체 글

Ludo 프로젝트 진행 중, Lighthouse 자동화 환경 구축을 진행한 경험을 복기한 글입니다. ✔︎ Lighthouse 자동화 환경 구축 관련 PR📓 Lighthouse CI 자동화 환경 구축 계기Ludo 프로젝트 중 2차례의 마일스톤에서는 주요 기능 구현에 집중을 하여 프론트엔드 성능 최적화는 자연스레 후순위로 밀리게 되었습니다. 그리하여 3차 마일스톤에서는 프론트엔드 성능 개선을 목표로 설정하고, Lighthouse를 활용한 성능 개선 작업을 진행하였습니다.성능 개선 과정 중에 수정된 코드를 반영한 후 개발자 도구의 Lighthouse를 실행시켜 성능 지표를 확인하는 과정을 반복하게 되었습니다. 그리하여 이러한 반복적인 작업을 자동화할 필요성을 느끼게 되었고, Lighthouse CI를 적용하..

📓 함수형 프로그래밍자료 처리를 수학적 함수의 계산으로 취급하고 상태와 가변 데이터를 멀리하는 프로그래밍 패러다임의 하나로 함수의 응용을 강조한다.장점높은 수준의 추상화를 제공한다.함수 단위의 코드 재사용이 수월하다.불변성을 지향하여 프로그램 동작 예측이 쉽다.📓 불변성(Imutablity)상태를 변경하지 않는 것을 의미한다.상태를 변경한다는 것은 메모리에 저장된 값을 변경한다는 것을 의미한다.📓 추상화어떤 작업을 수행할 때 그 이면에 존재하는 복잡한 것들을 간단한 것처럼 보이게 만들어주는 것, 또는 그러한 기능을 의미한다.추상화의 수준이 높다는 것은 복잡한 것을 단순해보이도록 만드는 행위 자체의 수준이 높아졌다는 것을 의미한다.예시) 기계어보다 어셈블리어가, 어셈블리어보다 Javascript가 추..

이 포스팅은 코드트리 X 글또 블로그 챌린지 2기를 통해 코드트리 체험권을 받아 작성한 후기입니다. 지난 글 - 코드트리 한달간 사용한 솔직 후기 감사하게도 글또 10기에서 진행하는 `코드트리 X 글또 블로그 챌린지 2기`를 통해 2~3월에도 부족한 코테실력을 기를 수 있었습니다. 이전 글에서는 코드트리에서의 지속적인 실력향상을 위한 전체적인 학습 방법, 커리큘럼 등의 장점등에 대해서 언급했었다면, 이번에는 문제를 풀면서 몸소 체험했던 여러 장점에 대해 말하고자 합니다. 💡 기본개념 제공코드트리는 각 커리큘럼 내에서 문제 유형을 기준으로 Chapter가 있고, 각 Chapter 내부에서 세부 유형인 Lesson으로 다시 한번 분류하여 문제를 제공함으로써 학습자는 보다 구체적이고 체계적으로 각 문제 유형..

📓 HTTP✔︎  HTTP란 HyperText Transfer Protocol로 하이퍼텍스트란, 사용자가 문서 내에세 링크를 통해 관련된 다른 문서로 바로 접근할 수 있는 텍스트를 말한다. 하이퍼텍스트를 전송하려던 초기 목적에서 시작하여 다양한 데이터를 정소하는데 사용되고 있다. HTTP 기본 포트는 80, HTTPS의 기본 포트는 443이다. ✔︎ HTTP 특징1. 무상태성(Stateless)    - 서버가 클라이언트의 상태를 보존하지 않는다.    - 상태가 없어 서버를 확장/변경해도 문제가 없지만, 클라이언트가 서버에게 데이터를 일일이 전송하여야 한다.2. 비연결성(Connectionless)    - 요청을 주고받은 후 연결을 끊는다.    - 각 연결당 서버 자원 사용량을 적게 유지하여 효율..

본 글은 프로세스와 쓰레드에 대한 학습내용을 정리한 글입니다. 📓 Process💡 Process Concept 등장 배경초기에 컴퓨터는 프로그램을 한번에 하나씩 실행했기 때문에 한 프로그램이 자원을 독점했었다. 하지만 다중 프로그래밍의 환경이 조성됨에 따라 여러 프로그램을 메모리에 적재하여 병행 실행할 수 있게 되었다. 따라서 컴퓨터 자원을 할당, 제어할 수 있는 방법이 필요하게 되었고 이 과정에서 프로세스라는 개념이 등장하게 되었다.💡 Process Concepts프로세스란 다음과 같이 다양한 방식으로 정의할 수 있다. ✓ 프로세스 정의메모리에 올라와 실행되고 있는 프로그램 인스턴스(독립적인 개체)운영체체가 시스템 자원을 할당하는 작업의 단위프로세서에 할당하여 실행할 수 있는 대상실행 도중 시스템..

이 포스팅은 코드트리 X 글또 블로그 챌린지 2기를 통해 코드트리 체험권을 받아 작성한 후기입니다. 작년에 삼성 코테를 준비하면서 기출문제를 풀어보기 위해 코드트리를 처음 접하게 되었습니다. 당시에 코드트리를 사용하면서 원하는 난이도의 문제를 찾아서 풀 수 있다는 점과 자세한 문제 해설을 제공한다는 점이 인상에 남았습니다. 운이 좋게 글또 10기에서 진행하는 `코드트리 X 글또 블로그 챌린지 2기`에 참여할 수 있는 기회를 얻게 되었고, 부족한 코테실력을 체계적으로 성장시킬 수 있는 좋은 기회라고 판단하여 `코드트리 X 글또 블로그 챌린지 2기`에 참여하게 되었습니다.코드트리 서비스는 코딩테스트를 준비하는 학생, 취준생, 이직자를 위한 학습 커리큘럼 및 실력진단 서비스를 제공하는 코딩테스트 학습 플랫폼입..

2025년이 된지 열흘이 넘게 지났지만 간략하게나마 2024년을 회고하고자 글을 작성합니다. 💡 팀 프로젝트를 통한 성장졸업 후 혼자서 개발 공부를 진행하면서 성장에 한계를 느꼈고, 개발 및 협업 역량을 키우기 위해 3개의 팀 프로젝트에 참여했습니다. 감사하게도 열정적인 좋은 팀원분들을 만나 프로젝트를 원활하게 진행할 수 있었고, 이 과정에서 문제 해결 능력, 협업 역량, 기술적 역량을 키울 수 있었습니다.프로젝트를 구현하기 전에, 서비스 요구사항 분석을 통해 실제 사용자들이 필요로 하는 기능을 명확히 파악하고, 이를 기술적으로 어떻게 구현할지 고민하는 시간을 가졌습니다. 이 과정에서 팀원들과 긴밀히 소통하며 다양한 아이디어를 도출하고, 사용자의 관점에서 생각하는 중요성을 배우게 되었습니다. 또한, 일..

react-slick 라이브러를 활용하여 banner를 구현한 과정을 기록한 글입니다.✔︎ Banner 구현 PR📓 React-Slick을 도입한 배경기존에 이미지가 넘어가는 간단한 기능만을 갖춘 배너를 구현했습니다. 하지만 배너에 추가적인 기능 요구 사항과 디자인 수정사항이 발생하였습니다. 그로 인해 여러 옵션을 통해 원하는 기능을 커스터마이징 할 수 있는 Banner 라이브러리 도입의 필요성을 느꼈고, 여러 브라우저와의 호환성을 보장하며 원하는 기능을 구현할 수 있는 옵션을 제공하는 react-slick 라이브러리를 도입하게 되었습니다. 📓 주요 기능 정의구현하기에 앞서 배너의 주요 기능을 정의하였습니다.일정 시간 간격으로 슬라이딩 방식으로 다음 이미지로 넘어간다.현재 맨 마지막 이미지인 경우 첫..