Automating Excel & PowerPoint: Built a React App in 8 Hours with AI (No Frontend Experience)

Think building a full-fledged app takes weeks? Think again.

For years, my team relied on cumbersome Excel and PowerPoint workflows to analyze consumer survey data. With nearly 1,000 brands to assess, updating calculations and slides was slow, error-prone, and frustratingly unscalable. Determined to streamline the process, I replaced the entire setup with a Python (Flask) backend and a React dashboard — despite having no prior frontend experience. Thanks to AI tools like Claude and ChatGPT, I built a functional MVP in just eight hours, cutting weeks off my original timeline.

App Demo:

(with dummy data)

demo created with loom

Business Background

At my company, we analyze consumer sentiment toward brands using survey data. The goal is to understand how brands emotionally resonate with consumers — whether they evoke excitement, relaxation, indulgence, or other emotions. These insights are structured into higher-level emotional needs, guiding strategic brand decisions.

The challenge? The entire process was buried in an Excel and PowerPoint nightmare.

1. Complex Excel Calculations

Our Excel file was massive, with weighted formulas, indexing, and normalization across thousands of rows and hundreds of columns. Copying and pasting to accommodate nearly 1,000 brands introduced endless risk for errors.

2. Manual PowerPoint Visualizations

Once the numbers were ready, the team still had to copy everything into PowerPoint slides and manually build bar charts. Changing brands or updating data meant rebuilding slides every time.

The Solution: Automating Everything

I replaced the manual workflow with an automated system that:

• Uses a Python (Flask) backend to handle complex score calculations and data aggregation.
• Features a React dashboard for responsive visualizations with dynamic filtering and comparisons.
• Offers a scalable and customizable alternative that adapts as our model and data evolve.

Part 1: Automating Excel with AI — Backend in 2 Hours

To streamline our data, I restructured the Excel file into three standardized CSV files — a scalable approach recommended by AI (Claude) that simplifies future edits compared to static spreadsheets:

• Brand Data: Metadata including category, temperature (hot/cold), etc.
• Brand Scores: Raw survey scores based on perception statements.
• Mapping File: Links between perception statements and emotional groups.

I then built a Python script (with Claude’s help) to merge the datasets, calculate scores, and created a Flask API to serve the processed summary data to our React app.

Part 2: Building a React App with 0 Frontend Knowledge

Despite my inexperience with React, AI (Claude and ChatGPT) guided me through the process:

• UI Generation: I shared a screenshot of the dummy summary data, and AI generated a simple React layout that structured the dashboard for filtering and viewing emotional insights.

• Setting Up React: After some initial hurdles with project configuration, I learned to organize components, manage state, and handle routing.
• Overcoming Performance Issues: When the app froze under a large dataset, I implemented a Web Worker to process data in the background and limited the UI to display 15 ranking scores at a time.
• UI Refinements: AI generated codes helped me restructure the brand comparison view into multiple vertical bar charts, create a “Needs View” for comparing key perception statements, and improve text formatting and aesthetics.

Lessons Learned

• AI as a Coding & Learning Partner: AI not only accelerated the development but also helped me grasp new technologies and best practices.
• Overcoming Technical Barriers: While AI generated the bulk of the code, effective debugging required targeted questions and iterative refinements.
• Custom Solutions Beat Off-the-Shelf Tools: A tailored React dashboard offers extensive customization and faster rendering for large datasets, while tools like Tableau and Power BI often struggle with limited flexibility and slower performance.

What’s Next? Scaling Beyond the MVP

This MVP has already transformed our workflow. Looking ahead, I plan to:

• Enhance filtering options and real-time calculations with dynamic weight adjustments.
• Incorporate more brand metadata for deeper insights.
• Expand the range of visualizations to meet diverse analytical needs.
• Enable raw data downloads for further offline analysis.

Final Thoughts

This project completely transformed our data analysis process by automating a once-manual workflow. With AI as a partner, I built a functional, scalable tool in record time — even without prior frontend experience. For anyone hesitant about using AI in development, this experience shows that with the right guidance and iterative refinement, powerful automated solutions are well within reach.