Chau (Joe) Nguyen, Kevin (Duc) Ho, Tan Vu, Matt Stewart
Hey fellow coders! We need an awesome Angular landing page for NinjaCodeGen, an Angular code generator, to show-case it's features. Also, we need your help on input for feature requests, so visit to rank them and add your own requests!
The NinjaCodeGen Landing Page is a landing page written in Angular, and has a beautiful design using Material Design. It has typical sections like top header menu, banner, features, gallery, ease scrolling, and footer. It also has a section to add and rate feature requests, chat, newsletter signup, which uses AngularFire2/Firebase, github authentication, and Angular animations.
Hey fellow coders!
Walk-through 4 Steps. 1. BASICS, 2. BUILD-UP, 3. MAIN ATTRACTION, and 4. WRAP-UP
1.BASICS — After click launch on the entry page, the logo goes to our website. “Blog” goes to this blog. “Try the Beta”/”Try our beta” goes to our beta. The social media icons at the top and bottom of the page go to our facebook and twitter pages. Click the section menu links to scroll (with easing functions) to that section.
2.BUILD-UP — In the Gallery section, click on any of the “See sample site” links to visit any of the 4 show-case apps (material design, bootstrap, ionic, Kendo UI) we generated with NinjaCodeGen in under 2 minutes. The Features section has content from the deployed app, but also gets data from our Firebase cloud database.
3.MAIN ATTRACTION — For the Features Voting section, you can rank feature requests and add new ones. Data is updated real-time so it’s nice to watch it update in multiple browsers or when someone else updates it. The Angular animations is also fun to watch. If you sign in to GitHub, you can manage your own personal feature requests and rankings. Also, when you log in, the chat window will appear. As you may have guessed, Firebase was also used to manage the cloud data, real-time syncing and authentication (OAuth providers).
4.WRAP-UP — The Newsletter section also saves your email to Firebase. It is pre-populated with your email when you login to GitHub. We did not forget, there is also a logout button. ;)
Believe it or not, before this competition, we had zero experience with FireBase, AngularFire2, and @angular/animations!
Please visit our entry, favorite it, give us feedback on feature requests, and sign up for the newsletter! http://www.angularattack.com/entries/271-ninjacodegen
#MCFA! Make Coding Fun Again!
Let’s go play with some code!
We will open source our code here soon: https://github.com/ninjacodegen
View the screencast:
It would be great if you rate us too
Well, your design is spot on. Handling Angular 2 for the first time and to get the mental model is a challenge. You did a nice job. Good luck for your Angular learning ahead.
Also, your feedback on my entry is very much appreciated.
I Would be glad if you could give me a feedback too :)
I stay tuned for amazing templates!
I would say that Angular is not he best tool for building landing pages, ha-ha =)
However, you did a great job! Like your design!
Your feedback to my entry would be appreciated as well.
Hi, did you build this entry during the 48h Angular Attack hackathon?
Please see our entry too.. thanks
Amazing cool app that you have developed in 48 hours. I really want to appreciate your idea and the effort took to done for this application.!! I loved it. Nice design and great app. Keep doing the Good work :) All the best :)
It will be great if you are playing a game which is developed by me and giving feedback :)
Very nice design :)
Nice idea! Found it a bit confusing at first, but the idea is really interesting. Like the Material design :)
Looks very well designed and neat. Great work!. Regarding code templates, can't I generate these templates using Angular CLI?
Nice landing page cool support Also mobile as well.
Nice entry! I would like to see better performance with the scroll animation and a spinner loading instead of the "Loading..." text.
This is definitely something useful for the community and something that I might use in the future.
The tech stack looks good! great start off with FireBase and AngularFire2. All the best!!
Excellent job! Very useful tool.
Nice app, you have done very well!
Nice app! I liked it.
Good job on showcasing different code templates and implementing git integration. Good luck!
Looks good, but not sure what the use of it is :) And I'm a bit wary of signing up for newsletters.