본문 바로가기

분류 전체보기

 (386)
<FE> Frontend-DevOps: 모던 프론트엔드의 역할 1. 소개 DevOps 라는 분야를 들어본적이 있을 것이다. DevOps는 개발(Dev)과 운영(Ops)의 결합을 통해 소프트웨어 개발 생명주기 전반에 걸쳐 효율성과 품질을 향상시키는 방법론과 도구 집합을 의미한다. 이는 지속적인 통합(Continuous Integration), 지속적인 배포(Continuous Deployment), 자동화된 테스트, 인프라스트럭처 코드화(Infrastructure as Code), 모니터링 및 로깅 등 다양한 관행과 도구를 포함한다. 이러한 방법론이 최근 Front-end 개발자에게도 요구되기 시작했다. 현대의 웹과 애플리케이션 개발 환경은 빠른 기술 변화와 다양한 요구 사항이 빠르게 변화하는 특성을 가지고 있다. 이러한 환경에서 프론트엔드 개발자들은 사용자 인터페이..
<네트워킹> AWSKRUG 프론트엔드 소모임 24년 1월 0. 행사 정보 - 일자 : 2024년 01월 03일 - 장소 : 무신사 캠퍼스 N1 (오프라인) - 시간 : 19:30 ~ 21:00 1. 소개 AWSKRUG (AWS한국사용자모임) 프론트엔드 소모임은 프론트엔드 개발자들의 지식과 노하우를 나누면서 함께 성장하는 모임이다. AWS 관련 내용만 다루는 것이 아닌 FE 분야 전반에 걸쳐서 내용을 공유하거나 토론하기도 한다. 행사에는 네트워킹 세션도 포함되어 있어 개발자들끼리 소규모로 얘기하는 시간도 가질 수 있다. 2. 내용 * 발표 세션 이번 행사의 발표는 최지연님의 "cognito와 next-auth를 통합한 커스텀 로그인 페이지 만들기"였다. 인증관련된 기능이나 사용자 관리를 위한 기능을 위해 AWS Cognito를 도입했고, 이를 next.js에 쉽..
<연간회고> 2023년 회고 및 2024년 목표 들어가며 2023년은 정말 폭풍같았다. 사건사고도 많았고, 시간도 정말 빨리 지나갔다. 월간회고를 쓰겠다고 다짐했지만 사실상 거의 쓰지 못했다. 가장 큰 사건이라 한다면 회사의 사업정리였다. 하던 일은 전부 중지되었고 불확실한 미래때문에 많은 주변 사람들이 떠났고, 나를 포함한 남은 사람들은 불안하게 지내야했다. 그럼에도 불구하고 아직 배울게 많은 주니어로서 성장은 놓치지 않으려고 노력했다. 마음이 복잡해서 작년에 세웠던 2023년 목표를 모두 이루지는 못했지만 스스로에게 부끄럽지 않을 정도로 달성했다고 생각한다. 2023년 회고 작년에 작성했던 블로그 글을 보면 목표는 크게 3가지였다. 첫째, FE+DevOps. 아쉽게도 DevOps는 많이 공부하지는 못했다. 하던 프로젝트가 계속 되었다면 운영측면을 ..
<개인발표> Next.js13으로 알아보는 FE렌더링 방식 0. 행사 정보 - 일자 : 2023년 08월 09일 - 장소 : 강남 교보타워 당근마켓 (오프라인) - 시간 : 19:30 ~ 21:30 - 내용 : AWSKRUG(AWS 한국사용자모임) 내의 AWSKRUG 프론트엔드 소모임은 FE개발자들의 모임이다. 비정기적으로 모임이 있으며, 발표 또는 토론 진행과 더불어 네트워킹이 진행된다. 1. 소개 6월에 우연히 AWSKRUG에서 발표자를 모집하고 있는 것을 봤다. 이맘때쯤 NextJS 13버전의 RSC가 흥미로워서 공부하고 포스팅을 썼었다. 내가 공부한 내용을 더 많은 사람이 알기를 바랬고, 더 많은 사람들과 얘기하고 싶었다. 그래서 혹시나하는 마음에 발표 신청을 했고, 8월모임의 발표자가 될 수 있었다. 2. 내용 * 기술발표 30분 정도의 발표시간으로 생..
<Docker> 도커 이미지 만들고 올리기 1. 만들기 * 소개 - 지금까지는 공식적으로 제공되는 이미지만을 사용했다. 하지만 이미 존재하는 컨테이너를 이용하면 누구나 쉽게 이미지를 만들 수 있다. - 이미지를 만드는 방법에는 두 가지가 있다. 첫 번째는 commit 커맨드로 기존 컨테이너를 이미지로 변환하는 방법이고, 두 번째는 Dockerfile 스크립트로 이미지를 만드는 방법이다. docker commit - 위의 명령어를 통해 컨테이너를 이미지로 변환한다. 미리 컨테이너가 준비되어 있어야 한다는 번거로움이 있다. - Dockerfile에 스크립트를 작성하면 스크립트를 빌드하여 이미지를 만들 수 있다. 호스트 컴퓨터의 폴더에 파일을 두고 컨테이너에 넣을 파일들도 함께 넣어 아래의 명령어를 실행한다. docker build -t * 실습 - ..
<UX심리학> 피크엔드 법칙 1. 소개 인간의 감정 반응은 복잡하다. 우리는 다양한 순간에 대한 수많은 감정을 느낀다. 하지만 어떤 순간이 우리의 전체 경험을 결정짓는가? 어떤 순간이 가장 인상적이고 기억에 남는가? 그것은 바로 가장 강렬한 순간과 마지막 순간이다. 이 두 순간은 우리가 어떤 경험을 어떻게 평가하고 기억하게 될지 결정한다. 이것은 '피크엔드 법칙'이라는 고객 경험 디자인 원칙의 핵심이다. 피크엔드 법칙은 소비자 심리학, 마케팅, 제품 디자인 등 여러 분야에서 활용되는 원칙이다. 이 원칙은 인간이 전체 경험을 기억하고 평가할 때 가장 높은 감정적 반응을 보였던 순간, 즉 '피크'와 마지막 순간, 즉 '엔드'가 결정적인 역할을 한다는 것이다. 이 원칙은 사용자 경험이 어떻게 구성되고 평가되는지에 대한 통찰력을 제공한다...
<Docker> 도커 컨테이너의 실전 사용법 : Volume 1. 소개 - 도커 컨테이너는 일회용으로 동작하는 특징을 가지고 있어서 업데이트나 재시작 시 이전 컨테이너는 폐기되고 새로운 이미지로부터 새로운 컨테이너가 생성된다. 이 과정에서 기존에 편집한 파일이나 데이터는 사라진다. 따라서 컨테이너 밖에 데이터를 저장하고 마운트할 수 있는 기능이 필요하다. 2. 연결 * 파일 복사 - 파일 복사는 도커 컨테이너와 호스트(도커 엔진을 실행 중인 PC) 사이에서 파일을 복사하는 방법이다. 파일 복사는 컨테이너에서 호스트로, 호스트에서 컨테이너로 양방향으로 가능하다. # 컨테이너로 파일을 복사 docker cp : # 호스트로 파일을 복사 docker cp : - 위의 명령어는 cp 커맨드를 사용하여 파일을 복사하는 방법이다. 순서로 작성한다. 이를 실습하기 위해 필자 ..
<UX심리학> 포스텔의 법칙 1. 소개 포스텔의 법칙은 사용자 중심의 경험 디자인에서 중요한 원칙 중 하나다. 이 원칙은 "자신이 행하는 일은 엄격하게, 남의 것을 받아들일 때는 너그럽게"라는 원칙을 통해 인터페이스나 시스템이 안정적이고 접근 가능해야 한다는 요구를 제시한다. 사용자가 어떤 기기를 사용하든, 어떤 기능이나 입력 메커니즘, 보조 기술을 사용하든, 심지어 어떤 연결 속도를 가지고 있든 간에, 인터페이스는 계속해서 제대로 작동해야 한다. 2. 포스텔의 법칙 * 포스텔의 법칙 기원 포스텔의 법칙은 미국의 컴퓨터 과학자 존 포스텔이 TCP 프로토콜 구현 과정에서 개발한 원칙이다. 포스텔은 스스로 견고함의 원칙이라고 명명한 법칙을 TCP명세에 도입한다. 이 원칙은 데이터를 전송하는 프로그램은 해당 데이터를 엄격하게 검사하고, ..
<Review> 생활코딩 머신러닝 이론편 1. 소개 - 제목 : 생활코딩 머신러닝 이론편 - 저자 : 이고잉, 이숙번, 오픈튜토리얼스 - 출판사 : 위키북스 - 페이지 : 148p - 목차 1부: 시작하기 2부: 앱 만들기 3부: 기획하기 4부: 통계 배우기 5부: 지도학습 6부: 비지도학습 7부: 마무리 2. 리뷰 * 내용 머신러닝에 대한 매우 기초적인 이론부분을 다루고 있다. 각 장에서 머신러닝에 대한 기초 내용과 간단한 사례를 통해 이해를 돕고 있다. 굉장히 쉬운 부분을 다루고 있기 때문에 기존에 통계학이나 머신러닝을 전혀 접해보지 못한 비전공자에게 좋다. * 느낀점 비전공자이지만 ML과 관련된 부서에서 일하고 있다. ML에 대한 기초적인 용어를 이해하기 위해 읽었다. 매우 얇은 책이고 굉장히 쉽게 설명되어있어서 금방 읽을 수 있었다. 3..
<FE> Next.js 13 으로 알아보는 FE 렌더링 방식 (SSR vs RSC) 1. 소개 FE 개발자라면 CSR(Client-Side Rendering)과 SSR(Server-Side Rendering)이라는 용어는 매우 익숙할 것이다. 이번 포스팅에서는 이와 같은 렌더링 방식에 대해 다룰 예정이다. 최근에 Server Components가 Next.js 13의 출시와 함께 등장하면서 렌더링 방식이 획기적으로 변했기 때문에 지금까지의 렌더링 방식의 변화과정과 RSC(React Server Components)와 SSR을 Next.js를 통해 비교해볼 것이다. 결론부터 확인하고싶다면 "3.비교" 부분부터 봐도 좋다. * 렌더링 방식의 변화 비교적 최근 FE에서 자주 볼 수 있는 렌더링 방식의 변화과정이다. 리액트와 같은 도구의 등장으로 CSR(Client-Side Rendering)..

티스토리툴바