한이음 ICT 멘토링(설문조사 플랫폼 - FE)

🗨️ 개요

---

• 한이음 ICT 멘토링에 참가하여 풀스택 기반 설문조사 플랫폼을 개발한다.
• React, Spring, Typescript, AWS 서비스와 같은 최신 기술을 프로젝트에서 경험한다.
• Restful API 기반의 백엔드와 SPA 프레임워크 기반의 프론트엔드 구조를 설계한다.

🗓️ 개발기간/인원

---

• 2021.03 ~ 2021.08
• 4인 프로젝트

⚙️ 개발환경

---

• React
• React-Bootstrap
• Javascript

🗞️ 담당 역할

---

• 전반적인 Frontend 구조 개발
• React를 이해하고 프로젝트에 적용

📂 Github Repository

---

smc5720/Hanium-Survey-Frontend

⚡ 평가

---

• 기존에는 HTML 코드 내부에 script 태그를 선언하고 JavaScript와 jQuery로만 개발했습니다.
• 이 경우, 추가하려는 폼이 많아질수록 함수 내부 코드가 길어지고 가독성이 떨어져 유지 보수가 힘들다는 단점이 있었습니다.
• 또한 동적으로 추가하려는 HTML 코드를 빽틱 내부에 작성하는 방식이 매우 불편해 코드 작성 및 디버깅에 시간을 많이 소모했습니다.
• React가 제공하는 JSX 문법이 코드의 가독성과 작성 효율을 높여줬습니다.
• JSX 문법 덕분에 코드의 가독성이 좋아지면서 Javascript 문법을 이전보다 폭넓게 활용할 수 있게 되었고, 데이터의 모양에 맞춰 변화하는 UI도 설계했습니다.
• 또한 HTML 코드를 컴포넌트화하여 관리하면 현재 개발 방식이 가진 단점인 함수가 너무 길어지는 부분과 유지 보수가 어렵다는 점을 모두 해결해 줄 수 있었습니다.
• 설문조사 카드 부분 같이 반복되는 부분을 컴포넌트화하여 쉽게 관리할 수 있다는 점이 React의 편의성인 것 같습니다.
• props와 redux를 적절히 활용해서 데이터를 편리하게 관리할 수 있도록 설계했습니다.

📎 첨부자료

---