Learn by Doing: A Comprehensive Guide on My Hackathon and Blogg…

Muhammad Noorani

Web Developer
Content Writer
Technical Writer

🚀💬 Introduction

Participating in the Hackathon by @WeMakeDevs x Napptive proved to be an incredible opportunity for me to explore the fascinating world of DevOps, the Open Application Model (OAM), and web development. The tracks in which I took part: Track-1 (Migrate an open source application to the Open Application Model) and Track-3 (Best use-case blog post). In this detailed blog post, I am excited to share my journey, valuable insights, and the wealth of knowledge I acquired while taking part in both tracks of this enriching Hackathon experience.

💡What is OAM (in very simple words)?

The Open Application Model (OAM) is a specification designed for describing and managing applications and their components. By providing a standard way to define and orchestrate the various parts of an application, OAM simplifies the application deployment process, making it more accessible to build, deploy, and scale applications across different platforms.

Track - 1 🏆

Migrate an open-source application to the Open Application Model

In this track, participants were tasked with migrating an existing open-source project to the OAM or building a new one and migrating it. The idea was to create a project that would be easy to deploy using the OAM, so I decided to migrate a Flask app to the catalog.

What Project did I work on?

For this track, I built a Flask-based task management web app. Though I had no prior experience with Flask, I learned by doing. The app uses local storage in your browser, which I also learned by doing. I spent 20 hours brainstorming before the Hackathon, and I was very active on the event's Slack channel, asking multiple questions to clear my doubts.

Developing the Flask Task Management Web App 💻

When I started developing the Flask Task Management Web App, I was new to Flask. I began by learning the basics of Flask, such as routing, rendering templates, and handling user input.
I built a simple app that allowed users to create, edit, list, and delete tasks.

Understanding Local Storage 💾

During the development process, I faced an issue with data persistence. I didn't want to add a database, so I researched alternative solutions and discovered the concept of local storage in the browser.
Local storage allows web applications to store data persistently in a user's browser, making it an ideal solution for small-scale applications that don't require a backend database.

How much time did it take?

It took me 40 hours to complete this project, with 20 hours spent on brainstorming and asking questions on Slack. I made sure to ask questions that were not readily available on Google or were unclear.
What were my learnings?
During this track, I learned a lot about various technologies and concepts, such as:
Docker: I learned how to create Docker images and containers, making it easy to deploy applications consistently across different environments.
Kubernetes: I gained an understanding of how Kubernetes clusters work and how they can be used to manage containerized applications at scale.
YAML: I learned the basics of YAML and how it is used to create configuration files for various tools, including Kubernetes and OAM manifests.
Flask: I learned how to create a Flask application and connect Python Flask files with HTML files to build a functioning web app.
Local Storage: I explored how local storage can be used in a browser to store data persistently without requiring a backend database.
Though I didn't win the Hackathon, my blog was selected for the finals, and the experience was priceless.

What was the process to use the Napptive platform to deploy the app to the catalog? 🔨

Create a Docker image of the complete project.
Choose a deployment method (I used creating OAM manifests (YAML files) method).
Deploy the app using the chosen method.

Track - 3 🏆

What Blog did I write? 📝

For this track, I wrote a blog titled "Scaling Flask Task Management Web App with Open Application Model (OAM) and Napptive - A Case Study."

Why I wrote this use-case

I chose to write this use-case to demonstrate how the Flask Task Management Web App can be easily scaled using the Open Application Model (OAM) and Napptive.
This case study aimed to showcase the practical implementation of the concepts and technologies I learned during the Hackathon.

🔥Bonus section: How to learn by doing my step-by-step approach 💻

Brainstorm what you want to achieve/do: Start by determining your goals and objectives for the project. In my case, for Track-1, I wanted to migrate a Flask app to the OAM catalog, making it easy to deploy for other developers.
Plan it on pen and paper: Outline the steps needed to achieve your goals, including any resources or tools required. For the Flask Task Management Web App, I planned the app's functionality, the technologies I needed to learn (Flask, local storage, Docker, and YAML), and the deployment process.
Keep all the prerequisites ready: Gather all necessary materials, resources, and tools before beginning the project. Before diving into the Hackathon, I researched Flask, local storage, and Docker to familiarize myself with these technologies.
Clear all your doubts by asking relevant questions: Utilize community resources, online forums, or ChatGPT to resolve any doubts or clarify concepts. During the Hackathon, I actively participated in the event's Slack channel, asking multiple questions to clear my doubts and learn from others.
Start coding: Begin working on your project, iterating and improving as you learn and grow. I spent 40 hours on the Flask Task Management Web App, learning by doing, and implementing new technologies as I progressed.

Conclusion ✍️

Though I didn't win the Hackathon, my blog was selected for the finals, and the experience was invaluable. I learned Docker, Kubernetes, YAML, and how Python Flask files interact with HTML files. Additionally, I networked with the amazing team behind the event. The benefits I gained from participating in this Hackathon were endless.

Links 🔗

Live link to the project: Flask Task Management Web App
Feel free to run the project, use it, and share your feedback. Your input is appreciated!
By participating in this Hackathon and sharing my experience, I hope to inspire others to adopt the "learn by doing" approach.
This approach encourages individuals to immerse themselves in a subject, explore new technologies, and gain practical experience. In my case, I discovered the power of local storage, Flask, Docker, Kubernetes, and YAML. By diving headfirst into these technologies, I was able to grasp complex concepts and achieve a deeper understanding.
Ultimately, the Hackathon served as an excellent opportunity to learn, network, and grow. The event organizers and participants were supportive and eager to help one another. Through this collaborative environment, I was able to learn valuable skills and insights that will undoubtedly benefit me in my future projects.
In conclusion, the "learn by doing" approach can be a powerful tool in developing new skills and understanding complex concepts. By participating in events like Hackathons, you can challenge yourself, expand your knowledge, and grow as a developer. Remember, the benefits of taking part in such events are endless. So, go ahead and take the plunge – you never know what you might discover!

You can find me on these platforms 🤝 :

Subscribe to my newsletter

Read articles from Muhammad Noorani directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Partner With Muhammad
View Services

More Projects by Muhammad