Opize 개발이야기 포스팅을 시작합니다 🙌 [Hello#1]

phw3071·2022년 9월 19일
0
post-thumbnail

🙌 반가워요!

안녕하세요. 혀느현스입니다! 저는 고등학교 3학년이자, Opize의 개발자이자 대표(?)로 일하고 있습니다.

이번 포스트을 시작으로 긴 시간동안 쓰게 될 이야기는 Opize를 만들면서 겪었던, 그리고 겪고 있는 이야기입니다.

😎 이것만을 알아주세요!

Opize 개발이야기는 절때로 코딩 강의 가 아니라, 서비스를 만들면서 겪었던 이야기 입니다.

물론 개발과 관련된 이야기이니만큼, 프로그래밍에 관련된 이야기가 많이 등장할 예정이에요. 그 동안 시행착오를 기반으로 제가 알게된 것을 최대한 공유할 생각입니다.

그러나 제가 작성한 코드가 항상 정답이 아니라는 것은 꼭 알아주세요. 당장 백엔드 코드도 몇 번씩 갈아엎을 정도로 아직 개발 실력이 시니어, 주니어 개발자에 비해 부족한 편입니다. 시행착오를 바탕으로 적는 만큼 완벽한 코드아닐 가능성이 높아요.

그러니 제가 작성한 코드는 이런 코드도 존재할 수 있구나로 바라봐주시고, 혹시 조금이라도 부족한 부분이 있다면 언제든지 알려주세요! 잘못된 정보를 알려드리는 것 만큼 죄송스러운 일이 없는 것 같습니다.

📚 챕터 별 이야기

하고 싶은 이야기가 많다보니 하나의 시리즈로는 제가 하고 싶은 이야기를 전부 못 담을 것 같아요. 당장 쓰고 있는 아이디어도 50개가 넘어가고, 순서대로 작성하는 것도 아니라 많이 혼란스러울 것 같습니다.

그래서 하나의 시리즈 대신, 각 분야 별로 시리즈를 나누어 진행하기로 했습니다!

01 기획 시리즈

전 전문 기획자도 아니고, 혼자서 모든 것을 개발하다보니 기획이 철저하지 않습니다. 이 챕터에서는 기획하는 방법 을 포스팅하기보단 개발했더니 이런 기획이 필요하더라 가 주요 내용이 될 것 같습니다.

여우 모양의 아이콘을 가지고 이상한 서비스를 만들어내는 Opize 에 대한 소개도 조금이나마 적을려고 합니다.

01 기획 시리즈 에서는 Opize를 만들기 위한 기획서, 브랜딩, Opize의 방향성 등을 주로 다룰 예정입니다.

02 디자인 시리즈

Opize를 만들면서 다양한 디자인을 만들었습니다. 처음에는 "그냥 보이는대로 디자인하면 끝 아니야?" 라고 생각했던 시절도 있었는데, 이 분야에 조금 들어가보니 정말 개발 쪽 만큼이나 체계화되고 규칙화 되어 있더라고요. 심지어 그래픽 툴인 피그마를 쓰면서 실제 개발을 하는 것처럼 컴포넌트를 만드는 걸 보고 조금 놀랐던 적도 있습니다.

02 디자인 시리즈에서는 UI 디자인컴포넌트 UI 디자인, 일반적인 디자인, 피그마와 관련된 이야기를 주로 다룰 예정입니다!

03 디자인 시스템 시리즈

스토리북 https://design.opize.me
레포지토리 https://github.com/HyunsDev/opize-design-system

사실상 Opize 개발이야기의 핵심과 같은 챕터입니다.

Opize를 개발하면서 가장 큰 노력을 쏟고 있는 부분이기도 하고, 지금까지 계속 개발하고 있는 프로젝트입니다.

Opize는 하나의 프로젝트 가 아니라, 여러 프로젝트를 모은 플랫폼 이기 때문에, 다른 프로젝트에서도 Opize라는 것을 나타낼 수 있도록 일관된 디자인이 필요했습니다.. 따라서 일관된 UX/UI를 제공하기 위해 Opize만의 디자인 시스템을 만들기로 결정했습니다!

03 디자인 시스템 시리즈에서는 스토리북을 이용한 React 디자인 시스템 개발부터, UX Writing와 비 개발 분야도 다룰 예정입니다. 단순한 컴포넌트 라이브러리가 아니라는 점 알아주세요!

04 프론트엔드 시리즈

03 디자인 시스템 시리즈 에게 많은 내용을 빼앗겨 버린 시리즈입니다. 대신 저의 첫 Next.js 프로젝트이기 때문에 Next.js의 특징과 사용법에 대한 내용이 주가 되겠네요.

04 프론트엔드 시리즈에서는 Next.js프론트-백엔드와의 협동에 대해서 다룰 예정입니다!

05 백엔드 시리즈

사실 이 글을 작성하던 시점에서 백엔드는 완전 개발 초기인 상태입니다. API 문서나 데이터베이스는 다 설계하긴 했는데, Express로 구현을 하다보니깐 애로사항이 많더라고요. 현재 Express + Sequlize 조합인데 나중에 Nust.js + TypeORM 구조로 변경될 가능성도 있습니다.

물론 설계가 많이 바뀌더라도 이미 알게된 내용이 많기 때문에 이론적인 내용도 다룰것이 많습니다. 예를 들면 의존성 주입이나 DTO 같은 내용이 있겠네요.

05 백엔드 시리즈에서는 백엔드 설계를 위한 지식, 데이터베이스, Express(변경될 수 있음), Sequlize(변경될 수 있음)에 대해 다룰 예정입니다.

06 클라이언트 라이브러리 시리즈

이 시리즈는 원래 04 프론트엔드 시리즈 에 넣을려다가 떨어져나온 시리즈입니다. 이 라이브러리에 대해 간단히 소개를 드리자면, API를 편하고 타입 안전하게 사용할 수 있는 라이브러리 입니다. 더 간단하게 axios + API 문서 + 타입 이라고 보셔도 됩니다.

아까도 말했듯 Opize는 여러 프로젝트가 있는 플랫폼 이기 때문에 API가 중요하고, 그 사용량도 많습니다. 그런데 그 많은 API을 axios로 하기에는 타입이나 오류같은 부분이 귀찮다보니 이런 부분을 미리 처리할 수 있도록 라이브러리를 만들게 되었습니다.

참고로 이 라이브러리는 Notion SDK JS (@notionhq/client)의 구조를 거의 그대로 가져와 사용했습니다. 라이브러리를 분석하면서 얻은 여러가지 교훈도 함께 작성합니다!

06 클라이언트 라이브러리 시리즈에서는 클라이언트 라이브러리를 만드는 과정을 주로 포스팅을 예정입니다.

07 개발 시리즈

코드 타이핑만이 개발의 전부가 아닌 것처럼, 깃 컨벤션, 풀 리퀘스트, ESLint, Pritter 같은 것도 중요하고, 개발을 도와줄 플러그인 이나 서비스도 있기 마련입니다.

작은 규모의 개발을 하다가 큰 규모의 개발을 하다보니 확실히 알게되는 부분이 많아 공유하려고 만들었습니다

07 개발 시리즈에서는 개발을 도와줄 수 있는 협업 규칙, 라이브러리, 플러그인등을 다룹니다!

08 운영 시리즈

앞에서 말했듯 저는 현재 사업자 등록을 하고 Opize를 운영중입니다.

그 동안 사업자 등록, 은행 계좌, 사용자 문의 여러 경험이 있었고, 이에 대한 기록도 남기고자 시리즈를 만들었습니다.

08 운영 시리즈에서는 혼자 사업자를 운영하면서 겪은 이야기를 다룹니다!

총정리

Opize 개발이야기 시리즈 🎉

기획 시리즈
디자인 시리즈
디자인 시리즈
프론트엔드 시리즈
백엔드 시리즈
클라이언트 라이브러리 시리즈
개발 시리즈
운영 시리즈

카카오톡 오픈채팅방

https://open.kakao.com/o/gPh2MrCe
이 시리즈에 대해서 여러분과 이야기도 나누고자 오픈채팅방을 만들었습니다! 제가 일 안하면 채찍질도 해주시고, 궁금한 이야기가 있으면 물어보셔도 됩니다.

profile
새로운 상상을 하고, 상상을 현실로 만드는 고3 개발자

0개의 댓글