ICT 인턴십 1주차

어떤회사인가요?

직장인이 관심사를 가질만한 라이프스타일 콘텐츠를 소개하고 참여를 유도하는 서비스를 개발하고 있습니다.

평생직장이라는 개념이 사라지고, 직장인들의 N잡과 부수입 창출에 대한 관심도가 높아지면서 새로운 경험 및 네트워킹을 찾아가는 수요가 꾸준하게 증가하고 있음에 따라 이러한 네트워킹 자리를 마련하고 소개하는 서비스 개발에 힘쓰는 회사입니다.

나아가 소자본 및 제한된 이련으로 마케팅 역량이 부족한 개인과 소상공인을 위한 멤버쉽 솔루션으로 확장 할 예정입니다.

 

내가 인턴으로써 맡게 될 업무는?

커뮤니티 멤버십 서비스 활성화

• 멤버십 주요 기능 개발
• 멤버십 및 신규 서비스 UI/UX 기획
• 멤버십 주요 정책

---

1주차 업무

대표님께서는 현재 회사 서비스에서 이용하고 있는 서드파티 대시보드를 좀 더 보기 직관적이게 바꿔달라는 말씀을 하셨다.

처음엔 서드파티 대시보드에 대해 생소하기도 하여 알아보았는데, 쉽게 생각해서 어드민 페이지라고 생각하면 이해가 빨랐다.

어드민 페이지인데, 데이터나 수치가 좀 더 수치화되어 직관적으로 보이는 대시보드를 개발하기를 원하셨다.

하지만 회사에는 지도인력이 없다.(백엔드 개발자 두분이 계시지만, 나와는 다른 프로젝트를 진행하고 계시는 것 같다.)

그래도 혼자서라도 최대한 개발해보는게 좋은 경험이 될 것이라고 생각하기에 일단 대시보드의 UI부터 구성해보고자 한다.

 

MUI(Material UI) 를 사용해보자

개발을 처음 시작하고부터, 지금까지 프론트엔드 개발을 하면서 UI 라이브러리를 사용해 본 경험은 없다.

UI를 만드는것도 프론트엔드 개발자의 업무고 그것마저 하지않는다면 대체 프론트엔드 영역은 어떤일은 하는건가? 라는 생각으로 항사 직접 구현했었다.

하지만 그럴 수 있었던 건 비교적 데드라인이 널널하고, 설령 만족할만한 UI를 뽑아내지 못하더라도 어떠한 책임이나 부담이 없었기 떄문이였다

하지만 회사는 데드라인이 확실히 존재하고, 어떻게 해서든 해당 기한안에 결과물을 만들어내야 하는 곳이다.

그렇기에 혼자서 대시보드 개발을 맡은 나는 UI라이브러리를 사용하여 개발을 해보기로 마음먹었다.

 

MUI란?

구글의 디자인 철학이 담긴 Material Design을 구현한 자바스크립트 UI라이브러리다.

5버전이 출시되면서 emotion을 접목시켜서 styled-components와 유사해졌다.

스타일드 컴포넌트처럼 컴포넌트 안에 내장된 sx를 사용하여 작업한다.

이 라이브러리는 material design이 적용된 UI 컴포넌트들,

그리고 그 컴포넌트를 제어할 수 있는 API, 그리고 커스터마이징 옵션들을 제공한다.

 

---

MUI 사용한 대시보드 UI

docs를 아무리 훓어봐도 직접 해보는것만 못하기 때문에 코드 읽어보면서 간단하게 수치만 바꿔서 커스텀해보았다.

구글이라 그런가 확실히 깔끔하고 군더더기없는 UI이다.

이제 안에 데이터를 잘 채워놓으면 혼자서도 대시보드 구현이 가능할 것 같다.
라이브러리를 잘 이용하는것도 실력!!! 
유용한 라이브러리 MUI 강추.