This used AngularJS and was based on this Stack Overflow question. This site demonstrates AngularJS features such as Bootstrap Collapse, Directives, and Templates.
AngularJS Examples
This used AngularJS and was based on this summary. This site demonstrates AngularJS features such as ng-repeat, Formatting, and Filtering.
Sushi Menu
This used AngularJS and was based on this tutorial. This site demonstrates AngularJS features such as Filters, Ordering, and Services.
Legend of Korra Benders
This used AngularJS to sort The Legend of Korra characters by their bending abilities. This site demonstrates AngularJS features such as JSON, Factories, and Routes.
Array Interview Problem
This site has a walkthrough of an array Interview Question solved with JavaScript.
AngularJS Clock
AngularJS Templates
This used AngularJS and was based on this walkthrough. This site demonstrates AngularJS features such as Routes, Templates, and Controllers.
Update:
The AngularJS routing conflicts with the Ruby on Rails routing. I tried to use Code Pen but it does not allow multiple HTML files which are required for AngularJS templates. As a result I built this site using Plunker.
Curtains
This was built with JQuery Easing and was based on this tutorial. This animation provides a link to this blog entry where I detail my lessons learned from 75 days of building sites.
Here are my reflections:
What have I done well?
- Had fun exploring HTML5, CSS, JavaScript, JQuery, AngularJS, APIs, Bootstrap, and much more.
- Focused on small and consistent steps. Made sure to learn by building small pieces and gradually adding on to those pieces.
- Used tutorials when I needed to get started with new technologies.
- Learned from Free Code Camp and solved coding challenges at Code Wars.
- Used Google, documentation, Stack Overflow, Github to build my sites.
What would I have done differently?
- Try to put the pieces together better, i.e. make sure the AngularJS sites have the Bootstrap design features.
- Don’t be afraid to abandon Ruby on Rails especially if I dive more into AngularJS and want to synchronize with a database. If this were to happen, don’t hesitate to learn Node and the rest of the MEAN Stack.
- Build more basic sites where I learn and explain a concept, i.e. a coding problem, or a computer science concept like Closures.
Overall this has been a rewarding journey and I have learned, built, and shared much. I am especially proud to say that I have learned how to learn. If I have an idea, I know how to read Stack Overflow, blog posts, documentation, and if these do not yield a solution, I also know how to get help from Slack, IRC, or from Meetup members. I am eager to see where the rest of this journey will take me, and which concepts or technologies I might explore next…
AngularJS Routing
This used AngularJS and was based on this example. This site demonstrates AngularJS features such as Route Service, Templates, and Controllers.
Update:
The AngularJS routing conflicts with the Ruby on Rails routing. As a result, I built this site in CodePen. I will likely build a number of AngularJS sites that involve routing in CodePen.
To learn Routing and other AngularJS features, I will continue to use my favorite process–small and consistent steps that will snowball into massive learning and building 🙂
String Interview Problems
This site has demonstrations of a few common String Interview Questions solved with JavaScript.
Check out Free Code Camp’s Bonfires for lots of JavaScript practice problems.
Code Wars is great because I can solve problems and then see how others solved the same problem. Code Wars has been engaging and fun and I have also learned many different approaches and methods to solving coding challenges. Also it is gamified so I have many different opportunities to increase my points and my ranking 🙂