Ask HN: Good JavaScript single page applications to learn from
8 comments
I like the structure of the game 2048 https://github.com/gabrielecirulli/2048 and I think it will be highly instructive for you since it implements the MVC pattern without using a framework, and you want to be framework agnostic. 2048 is simple enough that it's an accessible introduction to software design.
Daniel Janus wrote a great analysis of the source code and architecture; I highly recommend reading it: http://blog.danieljanus.pl/blog/2014/04/02/2048/
Daniel Janus wrote a great analysis of the source code and architecture; I highly recommend reading it: http://blog.danieljanus.pl/blog/2014/04/02/2048/
I'm not going to hold these up as ideal examples of AngularJS apps, but you might find them interesting:
* https://github.com/JohnMunsch/PaperQuik
* https://github.com/JohnMunsch/ClearAndDraw
They're both deployed on the web so you can play with them to see if they're in any way interesting to you. I wrote both of them last year to play with and learn some things and then I open sourced both of them.
Good luck with your learning.
* https://github.com/JohnMunsch/PaperQuik
* https://github.com/JohnMunsch/ClearAndDraw
They're both deployed on the web so you can play with them to see if they're in any way interesting to you. I wrote both of them last year to play with and learn some things and then I open sourced both of them.
Good luck with your learning.
Thanks, and both are helpful. I was originally going for framework agnostic because I'm still trying to answer some basic questions about JS (below, just for the sake of completeness) but I'm starting to think using AngularJS or EmberJS for an organized start will be good then I can try and generalize what I know.
Kind of like using Rails or ASP.NET MVC to learn MVC then branching out.
Some things I'm looking for examples in code instead of just blog posts are: 1 - When does someone attach a method to an object's prototype vs directly 2 - When do people use object literals vs defining a constructor 3 - How bind and apply are actually used to change the this binding
Thanks again!
Kind of like using Rails or ASP.NET MVC to learn MVC then branching out.
Some things I'm looking for examples in code instead of just blog posts are: 1 - When does someone attach a method to an object's prototype vs directly 2 - When do people use object literals vs defining a constructor 3 - How bind and apply are actually used to change the this binding
Thanks again!
I used this book http://shop.oreilly.com/product/9781782161820.do when learning AngularJS. It's by no means perfect, but it covers doing a lot of things in Angular and building a full SPA in the process. As far as good open-source examples, I'm not sure, but I'll be keeping an eye on this.
Take a look at Copay. https://github.com/bitpay/copay This is a AngularJS bitcoin wallet.
To me the real benefit of an SPA is using your web skills to build a GUI that can then run on different platforms. Take a look at ionic and some of the tutorials there.
To me the real benefit of an SPA is using your web skills to build a GUI that can then run on different platforms. Take a look at ionic and some of the tutorials there.
Also really good, thanks.
I agree, I want to learn more about SPAs because I'm working on them but also because I think it forces a good separation of concerns and makes sure whatever you're building can go cross platform easier.
It makes us the first consumers of whatever API we use for the data, kind of like TDD forces us to be the first users of our functions.
I agree, I want to learn more about SPAs because I'm working on them but also because I think it forces a good separation of concerns and makes sure whatever you're building can go cross platform easier.
It makes us the first consumers of whatever API we use for the data, kind of like TDD forces us to be the first users of our functions.
It may not be exactly what you want but codepen has some really cool and some really advanced JS projects:
http://codepen.io/
http://codepen.io/
> Good single page Applications
I'm pretty sure that's an oxymoron
I'm pretty sure that's an oxymoron
I've been searching GitHub and blog posts for any open source actual single page applications (not frameworks, generators, etc..) and have come up with some good resources but nothing that exactly fits my need.
There is a backbone example [1] but that's only a ToDo list. Pretty much all of the stuff I work on is more complex than that (I'm just a jr dev but the example is so contained), so these examples don't give me a good way of checking my work and understanding.
I understand people use ToDo as their demo because it allows for easy cross-comparison but for digging in it really doesn't help much. One object, tracking its few properties, and keeping a list will be maintainable and extensible just because of how small the codebase is.
So if anyone knows of some medium sized to large SPAs on GitHub that would be great. If there aren't any, if anyone wants to collaborate and build one together along with a series of blog posts or text files we throw in the directories along with our reasoning I'm down.
[1] https://github.com/thomasdavis/backbonetutorials [2] http://singlepageappbook.com/