Announcement

All-New Design

jin@gmail.com
Oct 16, 2023
Published byJin
All-New Design

All-New Design

안녕하세요, 백엔드 개발자 진입니다. 지금까지 총 네 번의 블로그 개편을 거쳐 마침내 썩 마음에 드는 블로그를 구현하게 되었습니다. 🥳 🎉

Prelude

2020년 11월 11일, 많은 것을 내려놓고 백엔드 개발자 로드맵에 오른 저에게 블로그는 불안함을 해소해 주었고 사소한 즐거움과 성취감을 안겨주었습니다.

글을 쓰고 정리하는 것은 학습하는 과정에서 생각을 정리해주고 이해되지 않은 부분과 부족한 부분를 명확히 구분해주었습니다.

그리고 코드를 작성하고 협업하는 과정에서도 많은 도움이 되고 있습니다. 프로그래밍이란 것도 결국 머릿속에 떠오른 알고리즘을 글로써 표현하는 일련의 과정이고, 우리는 또 많은 문서화 작업을 통해 자료를 공유하고 의사소통을 합니다.

Reminiscence

티스토리 기본 테마의 HTML & CSS를 수정하는 것으로 시작하여, GitHub에 공개된 JeyKyll 테마를 적용한 정적 사이트, 그리고 처음으로 밑바닥부터 하나하나 구현해 본 Vue.js 프로젝트까지... 나만의 블로그를 만들기 위해서 지금까지 많은 여정을 거쳐왔고 드디어 그 목적지에 다다르게 된 것 같습니다.

Take a Leap

이번 개편에서 가장 큰 변화는 아무래도 정적 웹에서 벗어나 백엔드 서버를 구축한 것입니다.

정적 웹은 구축한 이후부터 따로 관리할 것이 없고 마크다운 파일에 글만 작성하면 되어서 유지 보수를 신경 쓰지 않아도 됩니다. 그리고 비용도 따로 발생하지 않는다는 큰 장점이 있습니다. 그래서 그동안 서버를 따로 구축해야겠다는 생각이 들지 않았습니다.

하지만 이번에는 배운 것을 글로 정리하는 것뿐만 아니라 블로그를 통해 서버와 인프라적인 영역에서 다양한 학습과 실험을 하기 위해 데이터베이스를 설계하고 백엔드 서버도 구축하게 되었습니다.

Prototyping

아름다움은 디자이너의 타고난 재능, 엄격한 훈련, 그리고 다양한 사용자 경험들이 결합된 과학적 근거로 탄생합니다. 타고난 재능을 단련하거나 전문적인 기술을 습득하는 것은 어려울 수 있지만, 잘 디자인된 시스템을 따른다면 누구든지 훌륭한 제품을 만들어낼 수 있습니다.

디자이너들이 공유한 경험을 바탕으로 프로토타이핑 작업을 시작했습니다. 💎 Sketch를 활용하면서 생각이 차곡차곡 정리되었고, 머릿속에 그려져 있던 이미지가 점점 보다 구체적으로 표현되기 시작했습니다. 블로그의 전반적인 구조는 눈여겨 두고 있던 Spotify Engineering 기술 블로그를 모델로 삼았고, 테마는 블로그 화면 구현 과정 중에 모니터 하나를 독차지 하고 있던 Tailwind CSS 웹사이트를 참고해 구성하였습니다.

all-new-design-1.png

이 과정을 통해 보다 완성도 높은 블로그를 구현할 수 있었습니다. 물론, 여기서 완성도는 개인적인 견해입니다. 😅

Hello, React!

"Do not try to do everything. Do one thing well."

어려서부터 한정적인 시간을 쪼개 여러 가지 경험을 하는 것보다 마음에 드는 것 하나를 끊임없이 파고드는 것을 좋아했습니다. 그래서 백엔드의 바다에 뛰어든 이후로 계속해서 더 깊게 빠져들고 있습니다.

하지만, 프론트엔드의 기술력 없이는 간단한 웹사이트 하나 만들기가 버거운 것이 사실입니다. 그래서 조금 여유가 생겼을 때 그나마 가장 접근성이 용이했던 Vue.js를 학습하였고 간단한 어드민 웹사이트나 블로그를 만들 수 있게 되었습니다.

그런데 Vue.js는 세계적으로 React 만큼 활성화되지 못했고, React는 현재 사실상 국내 표준 기술이나 다름없습니다. 그래서 새로 개편하는 블로그의 코어 프레임워크를 선택함에 있어 이 둘 사이에서 정말 많은 고민을 하였습니다.

학습해야 할 백엔드 기술도 계속해서 늘어만 가는 상황에서 또 다른 프론트엔드 라이브러리를 학습한다는 것은 정말 큰 부담이었습니다. 그럼에도 고민 끝에 업계 표준 기술을 경험해 보는 것이 좋을 것 같다는 결론에 이르러 이번 블로그 프로젝트의 코어 라이브러리는 React로 선택하게 되었습니다.

Last But Not Least

블로그를 구현하면서 사용한 주요 기술과 툴입니다.

  • Backend 💠
    • Java 17
    • Spring Boot 3.1.4
    • JPA
    • Querydsl
    • MySQL 8
    • Redis
    • Amazon Web Services
    • Docker
    • Jenkins
  • Frontend 💄
    • TypeScript
    • React
    • Next.js 14
    • Tailwind CSS
    • Vercel
  • Tools 🧰
    • Macbook Pro
    • IntelliJ IDEA
    • WebStorm
    • DataGrip
    • Warp
    • Sketch

Outro

아직 구현해야 하는 기능이 많이 남았지만 🔖 Version 1.0.0을 성공적으로 릴리즈 할 수 있어서 뿌듯합니다. TypeScript와 React에서 헤매고 있을 때 심적 안정을 찾아준 옹이와 몽이도 고생이 많았습니다. 💖

all-new-design_00.jpeg all-new-design_02.jpeg all-new-design_00.jpeg

이제 열심히 포스팅만 하면 되겠네요...😳💦

더 많은 글 보기