개발자 Flik

안녕하세요. 프론트엔드 개발자 Flik입니다. 👋

개발을 하면서 드는 생각들이나 공부한 것들을 기록하고 공유하고자 이 사이트를 만들게 되었습니다.

Flikary는 저의 닉네임인 Flik에 -ary를 합성한 이름입니다. Diary(일기장), Library(도서관), Glossary(용어집) 처럼 다양한 의미를 연상시키는데요. Flik의 디지털 아카이브라고 볼 수 있을 것 같습니다.

기존에 여러 블로그를 운영해왔지만, 이 공간에서는 트렌디한 기술 정보나 조회수에 연연하기보다는 개발자 Flik으로서의 진솔한 이야기와 성장 기록을 담아내고자 합니다.

Blog Posts

• 나의 SEO 이야기

  Published:2025년 5월 5일

  기술 블로그를 직접 만들고 SEO를 적용하면서 얻은 경험과 전략을 공유합니다. 메타태그, 구조화된 데이터, 이미지 최적화, 성능 개선 등 실제 검색 결과에 영향을 미치는 요소들에 적용한 이야기를 담았습니다.

• 브라우저의 GPU 가속 이해하기

  Published:2025년 4월 30일

  브라우저가 GPU 가속을 사용하는 상황과 CSS 속성들을 알아보고, 웹 성능 최적화에 활용하는 방법을 정리합니다.

• AI가 글 써주는 시대를 마주하는 블로거 이야기

  Published:2025년 4월 13일

  AI가 글을 써주는 시대에 블로거로서의 경험과 통찰을 공유합니다. AI를 활용한 글쓰기 실험과 그 결과, 그리고 앞으로의 방향성에 대해 이야기합니다.

• 코드 스플리팅(Code Splitting)의 개념과 구현 방법들

  Published:2025년 4월 7일

  코드 스플리팅의 개념과 필요성, 그리고 React와 Webpack에서의 구현 방법을 알아봅니다. 번들 크기 최적화를 통한 웹 성능 개선에 대해 다룹니다.

• 자바스크립트 이벤트 루프 이해하기

  Published:2025년 4월 1일

  자바스크립트의 이벤트 루프와 렌더링 타이밍에 대해 자세히 알아봅니다. V8 엔진, 브라우저 API, 마이크로태스크, requestAnimationFrame 등의 키워드를 다룹니다.

• 테스트하기 좋은 코드에 대한 TDD 입문자의 고민

  Published:2025년 3월 16일

  TDD의 도입이 어려웠던 개발자가 다시 테스트코드를 고민하면서, 신용카드 포맷팅 예시를 통해 테스트하기 좋은 코드의 특성과 TDD에 대한 생각을 공유합니다.

• AI를 활용하여 2024년의 내 코드 돌아보기

  Published:2025년 3월 8일

  2024년에 작성한 코드를 주제별로 되돌아보고, 그 과정에서 AI를 어떻게 활용했는지를 이야기합니다.

• 새로운 블로그를 또 만들게 된 이유

  Updated:2025년 2월 26일

  나는 여러 차례 블로그를 만들고 운영한 경험이 있다. 그런데 이번에 새로운 블로그를 또 만들게 되었다. 기존 블로그를 운영하면서 느꼈던 한계점과 새로운 필요성을 정리하며, 이번 블로그 Flikary를 만든 이유를 돌아보고자 한다.

• 애자일 문화의 조직 구조 용어 짚어보기

  Published:2025년 2월 21일

  최근 애자일 기반 it기업에서 많이 활용되는 스쿼드, 챕터, 사일로 등 목적조직과 가능조직에서 사용되는 용어를 짚어보며 알아보고 정리합니다.

• Github Actions로 이미지 생성 자동화 하기

  Published:2024년 11월 14일

  Github Actions를 활용하여 텍스트 파일을 기반으로 자동으로 이미지를 생성하는 방법에 대한 포스팅입니다.

• 테크 블로그 이야기(feat. SEO, 애드센스)

  Published:2024년 4월 6일

  테크버킷 블로그를 만들어, SEO를 최적화하고 애드센스를 통해 수익을 창출하게 된 이야기입니다. Google Slide 로 제공됩니다.

• 사람의 글이 귀한 시대가 되었다

  Published:2024년 1월 23일

  AI의 영향으로 사람의 글이 귀해진 시대에 대한 짧은 고찰입니다

• 예제와 함께 React Native Reanimated v3 기본 개념 파악하기(처음 사용하기 위한 가이드)

  Updated:2023년 12월 6일

  React Native Reanimated의 기본 개념과 예제를 소개합니다. React Native Reanimated를 처음 사용하는 사람들을 위한 가이드입니다. React Reanimated는 React Native에서 고성능 애니메이션과 인터랙션을 구현하기 위한 라이브러리입니다. React Native Reanimated를 비롯하여 애니매이션 구현을 다루는 자료가 풍부하지 않기에 이 가이드를 작성하였습니다.

• hydrate가 무엇인가요?(react, next.js)

  Published:2023년 5월 4일

  리액트와 Next.js에서 "hydrate"는 서버에서 렌더링된 HTML 마크업에 기반하여 클라이언트 측에서 자바스크립트 이벤트와 상태를 연결하는 과정을 말합니다. 이를 통해 초기 로딩 시 클라이언트에서 즉시 상호작용이 가능하고, 이후에는 일반적인 리액트 애플리케이션처럼 동작할 수 있습니다. 'next.js 프로젝트를 다루다 보면 'hydration failed because the initial ui does not match what was rendered on the server'와 같은 에러를 발견하게 됩니다. 이와 관련하여 react와 next.js에서 hydrate의 개념에 대해 좀 더 자세한 정리를 합니다.

• GPT 토큰의 비밀. 한국어는 왜 더 느리고 요금도 더 많이 나올까?

  Published:2023년 4월 7일

  OpenAI API를 사용시 한국어 문장을 사용하면 더 많은 비용이 나오게 됩니다. 이와 관련하여 토큰의 개념, 영어와 한글의 토큰 수 비교, Tokenizer에 대한 내용을 정리하였습니다.

• Personal Access Token을 사용하여 깃허브 인증하기

  Published:2021년 8월 16일

  맥에서 Github 인증을 위해 Personal Access Token을 발급받고 osx-keycahin에 추가하는 방법을 설명합니다.