My minified journey with Web Development!

I came across web-dev for the first time in 2010 as there was a bit of HTML in my 10^th grade syllabus. The hardest thing about web-dev then was to decide if it’s </tag-name> or <\tag-name> while closing a tag. Fast forward four years, in summer 2014, I reluctantly took up a Diploma course in C# and ASP.NET from Manipal Institute of Computer Science (MICE) this course introduced me to the .NET framework over Visual Studio. It is thanks to this course that I gained a lot of interest in Microsoft and its technologies and then went on to become the Microsoft Student Partner for my institute. I had developed an interactive ASP.NET website named KnowMangalore.com which contained several facts about my hometown – Mangalore. Although this website helped me in learning C# and the Visual Studio environment, it did not essentially help me in understanding HTML as the front-end was on .aspx and moreover Visual Studio had this drag-and-drop feature using which you need not get your hands dirty with front-end code.

Moving ahead, Tanay Pratap, Coach & Curator of TechBack had come to my college in October, 2015 to conduct a workshop on development of responsive web pages using Bootstrap. The workshop started off right with the basics, which most of the workshops fail to do. It was in this workshop that I figured out the difference between an id and a class in HTML! Thus, Tanay played a pivotal role in helping me get a clear picture of how webpages work.

The TechBack workshop motivated me to learn more about web development. I bumped into this tutorial website – freecodecamp.com. It consisted of a step-by-step interactive tutorial for front-end and back-end development. One of the tutorials was on developing a personal web-app. It was thanks to this tutorial I started building a tiny web-app and simultaneously exploring into latest CSS and JQuery plugins like Carousel, Magnific Popup, Modernizr, etc. I then ended up restructuring the web-app into my resume by showcasing my technical skills, projects, previously attended events, etc. in it.

While I had started building the web-app, I had never planned on putting it up online. Thus, I was pouring several images into it. It took me a week to get it ready. At the end of the day it did look good! So I started exploring ways to deploy my web-app. Microsoft offers some free Microsoft Azure features to students including hosting of web-apps on an Azure subdomain. This way I was able to deploy my project on cloud. Once it was online, I noticed that the webpage would take really long to load (10+ seconds) as there were several images and scripts that had to be loaded while caching was disabled. I then used CDN links to deliver scripts and css files to the page. The load time did reduce but not by much. I then came across a JavaScript plugin named Lazy Load. Lazy Load delays loading of images in web pages. Images outside of viewport are not loaded until user scrolls to them. This significantly reduced the load time of the page. You can find my page on the flowing address – aniketprabhu.azurewebsites.net.

Further improvements that I have planned on implementing in this project include getting an SSL certificate and an upgradation from HTTP/1.1 to HTTP/2. The HTTP/2 protocol has a single persistent TCP connection unlike HTTP/1.1 which uses multiple connections. This drastically increases the page load speed. Also I’m exploring ways to have a permanent ‘.me’ domain for my page. Many vendors like Namecheap provide this feature for free to students with an email ID with a ‘.edu’ domain but it is valid only for a limited period of time.

f you like GeeksforGeeks and would like to contribute, you can also write an article and mail your article to review-team@geeksforgeeks.org.