Learn by Doing: A Comprehensive Guide on My Hackathon and Blogging Experience

Learn by Doing: A Comprehensive Guide on My Hackathon and Blogging Experience

πŸš€πŸ’¬ 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:

  1. Docker: I learned how to create Docker images and containers, making it easy to deploy applications consistently across different environments.

  2. Kubernetes: I gained an understanding of how Kubernetes clusters work and how they can be used to manage containerized applications at scale.

  3. YAML: I learned the basics of YAML and how it is used to create configuration files for various tools, including Kubernetes and OAM manifests.

  4. Flask: I learned how to create a Flask application and connect Python Flask files with HTML files to build a functioning web app.

  5. 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? πŸ”¨

  1. Create a Docker image of the complete project.

    • A Docker image is a lightweight, standalone, executable software package that includes everything needed to run a piece of software, including the code, runtime, system tools, libraries, and settings.

    • To create a Docker image, you need a Dockerfile, which is a script containing instructions to assemble the image.

  2. Choose a deployment method (I used creating OAM manifests (YAML files) method).

    • YAML files are human-readable data serialization files used for configuration files and data exchange between languages with different data structures.
  3. 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 πŸ’»

  1. 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.

  2. 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.

  3. 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.

  4. 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.

  5. 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.

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 🀝 :

Let's connect!!

Did you find this article valuable?

Support Muhammad Noorani by becoming a sponsor. Any amount is appreciated!