đź’ˇ Project Overview
“What if scattered election information was gathered in one place?”
During the election period, information such as news, polls, and candidate pledges was scattered across various platforms, making it difficult for voters to access. To solve this, I developed an Aggregator Service that collects and visualizes all election-related data.
I adopted AWS Amplify (Serverless) to efficiently build Authentication and Backend APIs, and utilized MUI (Material UI) and Recharts to implement an intuitive dashboard UI.
đź› Tech Stack
- Frontend: React, Styled Components, MUI (Material UI)
- Visualization: Recharts
- Backend (Serverless): AWS Amplify (Auth, API)
- Crawling & Network: Cheerio, Microlink, Axios
đź’» Key Features
1. Main Dashboard UI
The first dashboard users encounter.
Utilizing MUI’s Grid System, I organized the D-Day counter, daily headlines, and election timeline into a responsive layout.
2. AWS Amplify-based Authentication
Integrated AWS Amplify Auth to implement secure sign-up and login session management without the overhead of building a separate backend server.
Implemented custom login and sign-up modals to provide a seamless user experience.
3. Personalization (Bookmarks)
Users can bookmark articles of interest, which are synchronized to their personal storage via Amplify API (GraphQL).
4. News Curation & Visualization
Displays processed data collected via Naver News API in card format.
Enhanced information delivery by visualizing metadata (thumbnails, summaries) using Microlink.
5. Poll Charts
Visualized complex approval rating trends into intuitive line and bar charts using the Recharts library.
🧑‍💻 Role (Team Leader & Full Stack)
Led initial environment setup, AWS infrastructure integration, and core frontend development.
- Tech Lead: Established ESLint/Prettier conventions and introduced Git Flow strategy.
- Serverless Architecture: Built Authentication (Cognito) and Data (AppSync) communication environments using AWS Amplify.
- Frontend Development:
- Implemented data visualization components using Recharts.
- Designed a consistent UI system based on MUI & Styled Components.
- Resolved CORS issues and integrated APIs using Axios and Proxy settings.
💬 Retrospective: “Exploring the Potential of Serverless Architecture”
Productivity with AWS Amplify
By adopting AWS Amplify instead of building complex backend infrastructure, I created an environment where I could focus on business logic and data visualization. This allowed me to deploy a complete service featuring Auth, DB, and API within a limited project timeframe.