Sign in
Log inSign up
How I built my little Weight Tracking Application

How I built my little Weight Tracking Application

Mohammed Ayodeji's photo
Mohammed Ayodeji
·Jan 9, 2020

Since I am trying to be the best programmer I can be, I guess I will have force myself out of my shell of 'write less and do more' and imbibe the habit of curating all of my coding experience into blog posts.
In these few months of consistent coding I discovered that most successful programmers are also talented writers. That explains why the abundance of learning materials available to every programmer or wannabe programmer regardless of level of experience.

Today I will be following in the footsteps of my league of mentors by writing on how I built the front-end of a weight tracking application using only core technologies (html, css and a pinch of javascript).

This was an assignment given to us by a programming mentoring group I joined recently on twitter (bytenaija) and had two weeks to deliver.

I started working on this after a week or so because I had loads of personal stuff to attend to. The first challenge I had was finding a sample app with a very good UI I could use. I grew up playing with graphics designing tools so I know one or two things about beautifying things. Being a weight tracking application I figured it would be more of a mobile thing so I decided also to think in line of a mobile-first design. Having enough ideas of what my layout should look like I decided to go on a searching spree on Google Play Store to look for something I could easily replicate and voila I found a weight tracker application called ' 'Weight loss & BMI Calculator' I liked the design and feel and so I decided pitch my tent at that spot.

Immediately I swung into action, called up my code editor, prepared my starter template, linked all of my working files, minimized my browser just for the purpose of designing from a mobile-first perspective and began writing my html side by side with my css.

I finished writing my markup and styling in less than two hours so I decided on my own to go a little further and bring in some Javascript. Javascript was obviously out of the scope of the task but I couldn't help it not to be me. I felt I could do a little more at that moment on that day so I began the process of interaction that allows the user's input to be stored in the local storage and displayed underneath the form.

I coded for some additional hours and then discovered that the more coding I did the more ideas I was getting in order for me to make it full blown app which was way outside the scope of the original assignment. Also my limited knowledge of programming too wasn't going to help me deliver professionally and at the right time considering I had some days left to make my submissions.

When I was a little bit satisfied with my project I decided to call it a day and hung my boots appropriately.

My task for the next day as expected from the requirements of the assignment was to upload my local repository of my project unto my online repository and host on netlify. I did that immediately leaving one final last task which was blogging about my experience of building my project on my hashnode. Well, I thank my stars that I was able to put this here because prior to this write-up I have been in an unending writers block. Maybe and just maybe I have broken that spell of ' avoid writing stories '. So that's it. I hope someone out there gets a little bit of inspiration from my story. Below are links to my git repository and the netlify link to the project.

blissful-blackwell-3e0bed.netlify.com

github.com/weezys-box/tracka

Hassle-free blogging platform that developers and teams love.
  • Docs by Hashnode
    New
  • Blogs
  • AI Markdown Editor
  • GraphQL APIs
  • Open source Starter-kit

© Hashnode 2024 — LinearBytes Inc.

Privacy PolicyTermsCode of Conduct