We made a web app in 3 weeks...

Building In Public #2

Author

Emily Jiji
February 07, 2024

2 Weeks Ago I made a promise.

That I would launch a web app in 2 weeks to help people create a personal visionboard for their desktop.

No, the app isn’t perfect, but these were my learning goals:

React Animations

Achieved

Web Design

Achieved

Launching/Marketing

Achieved

If you missed my previous newsletter which discussed creating these learning goals, setting a timeline, and planning the app, check it out before continuing this newsletter.

How Did I Do It?

First, I wasn’t alone. I had my friend Teresa work with me on it by coding and giving me feedback. It’s always great to have another person to talk things through with.

We pulled an all-nighter. We didn’t have to, but we thought it would be a fun thing to do on a random Tuesday night. We weren’t on track to finish the product in the 3 weeks and I thought, if we don’t do this now, we will never be able to finish it.

This sense of urgency made us understand that now’s the chance to complete the website and pushed us to achieve our goals.

Curious of the end product? Here are some clips:

Welcome Page

Example Prompt Page

Choose Theme Page

Download Page

Want to Create a Tech Product? Do this.

  1. Set Goals - If you are not motivated to work on the topic or learn the tech, then it’s not the right project for you. Check out my previous post to see how I set my goals^

  2. Design - I used Canva to design visionboard layouts and Figma to visualize the flow of the app before coding. Doing this planning beforehand saved us a lot of time since we had a good direction for achieving this.

  3. Due dates - Give yourself a due date. We gave ourselves 3 weeks because we thought of this as a “lab assignment”. In our case, addressing our goals and finishing the web app were our primary objectives.

  4. Research & Explore Approaches - We learned about Canva API, Framer-motion React animations, and taking screenshots of div containers with html2canvas

  5. Make Some Decisions - Since completing the web app was a high priority, we made some decisions to save time and reduce complexity.

  • We chose not to use Canva API. Using it would significantly improve our product, but after playing with it we chose another approach. Using the API will require us to wait for Canva to approve us making the project public, preventing us from achieving our 3rd goal quickly (Launching/Marketing)

  • We didn’t make everything responsive. It would just take more time.

  • We decided to choose our own images for the different themes instead of having the user choose. This also saved us time.

  1. Launched on Anonymous sites - We launched on “dataisbeautiful", and “theinternetisbeautiful” Reddit communities along with Hacker News (Y-combinator)

    We understood our product wasn’t close to perfect, so we chose these places to launch.

Posting on Reddit

Reddit bans promotional content, so be sure to only link free products and word things carefully.


Format to follow: “I made X to do Y”

My format: “I created a site to give you a motivational visionboard for your desktop screen”

These are my results after 16 hours… not bad

Posting on Hacker News

On Hacker News I labeled my post “Visionboard AI” to drag more attention, even though it’s not AI. But hey, if I were to work on this more, maybe there will be AI.

  1. Deployed with Vercel - Vercel allowed me to securely share my web app with others for free (highly recommend)

Lessons Learned

Making this web app taught me the process by which apps are released and to expose myself to react animations. The purpose wasn’t to make a perfect product but to complete this process as fast as possible. Let’s just say mission accomplished.

Here is what this achievement did for me:

  • Gave me confidence in launching another app in the future

  • Helped me manage my time to do side projects in addition to my other responsibilities

  • Allowed me to spend time and learn to sync up with a coding buddy

  • Will let me focus on the product more next time instead of worrying about how marketing works.

In the following newsletters, I will share weekly updates on what I’ve learned, my startup journey, UF student founder stories, and will strive to be a source of encouragement for you guys.

Feel free to share this newsletter with anyone else who would find this useful on their tech journey!