I hope you had a great summer. I know I did. I had been very blessed to have been awarded with a scholarship from Google which also presented me with a flight and a 4 day retreat at the Google campus in Palo Alto, CA. It was an incredible experience in which i met many other amazing scholarship recipients as well as some very smart Google engineers. I also finished up a very rewarding 10 week internship at JPMorgan & Chase Technology. I learned so much while working there and was presented with all the help and encouragement I needed to succeed. They are definitely on the right track. With all that being said, I haven't forgot about my fellow Computer Science family out there and all the of you coders. I still maintain my will to grow my knowledge and that is what has led me this post. I decided to continue my learning on the previous garage server I have built and now I am updating it to IoTGarage 2.0. I decided to try my luck building the webpage as a stand alone AngularJS application to improve functionality and response time as well as user experience. This all sounds nice, but it was mostly to learn and share my experience with all of you. Hopefully it helps to propel you forward in your learning.
The latest commit was pushed up to GitHub and can be found here: IoTGarage
I rewrote the server requests (other than the initial) to respond to the Angular Http requests in text/json rather than loading all new html on each request. This is definitely a much better approach and gives the web page a much more native feel, like that of an application. It also leaves much room for growth on what information can be provided from the NodeMCU ESP8266 in the future. Information such as time between garage open/closings, past data that you chose to store about these actions, and much more. The webpage also now resizes based on which device you are accessing the server from. Therefore it is perfect for the mobile users. This makes sense due to the simple fact that most people wont be opening and closing their garages from their desktop..ha. Anyway, here are two looks at the new page on Desktop and then from a phone. I hope this code helps everyone and you should feel free to message me about an problems or questions. Remember to always, SudoAptUpgradeYourBrain!
Here are a few pictures of the new UI.
When visited by desktop:
When visited by phone :
when open is click :
When check is clicked :
when closed is click :
