Angular JS Resources

I just started getting into AngularJS and it is really hard to find information about it.  So I am going to compile a list of related links and resources on this page.  Please leave a comment with links that you think should be on this list.

  1. Homepage – http://angularjs.org/
  2. Google plus page, the best way to stay up to date on Angular news – https://plus.google.com/+AngularJS/posts
  3. Things built with Angular – http://builtwith.angularjs.org/
  4. youtube channel – www.youtube.com/angularjs
  5. Awesome Video Tutorials – http://egghead.io/
  6. AngularUI – a companion suite – http://angular-ui.github.com/
  7. Bootstrap components written in pure AngularJS by the AngularUI Team – http://angular-ui.github.com/bootstrap
  8. Angular Textmate Bundle (probably works with Sublime too) – https://github.com/angular-ui/AngularJs.tmbundle
  9. Stackoverflow – http://stackoverflow.com/questions/tagged/angularjs
  10. Angular JS Meetup Groups – http://angularjs.meetup.com/
  11. Angular JS Books – http://amzn.to/VbRfDW
  12. Angular Modules – http://ngmodules.org/
  13. Awesome Chrome Plugin for debugging - https://github.com/angular/angularjs-batarang (thanks Nadeem)

Articles

  1. Using RESTful Controllers In An AngularJS Resource
  2. AngularJS: Common Pitfalls
  3. Rendering DOM Elements With ngRepeat In AngularJS
  4. 3 Reasons to Choose AngularJS for Your Next Project
  5. 8 Tips for Angular.js Beginners
  6. Build Chrome Apps with AngularJS
  7. AngularJS: the beauty of concision

StarterWeb MVP – A Modern Web App Starter Template

My co-founder and I have been reading a lot of startup books lately.  If you are mildly interested in startups, you can’t escape the term MVP.  MVP or Minimum Viable Product is a concept popularized by Eric Ries author of  The Lean Startup.

In product development, the Minimum Viable Product or MVP is a strategy used for fast and quantitative market testing of a product or product feature, popularized by Eric Ries for web applications. – source wikipedia

A couple of weeks ago, we had our first offsite to brainstorm some ideas and clarify our vision and goals.  We agreed on a new product and the goal is to get it out by the end of the year.  I have been coding it for the past week or so and it is coming along nicely.   But I can’t help thinking back to the MVP. I don’t want a half-baked product but I also don’t want to spend the next 3 months building something that no one wants…  the solution is an MMVP i.e a Minimum MVP.

What’s the idea/product?  

It is called Starter Web.  It is a kick-ass starter web app to start your next web project, web startup or even to create your own MVP.  This is no HTML template, this is a project that has all the fundamental pieces of every web app built and tested, so you can focus on YOUR idea and not the BS that you always have to do (authentication, payment processing, etc…)

Who are our customers?

  • Web developers that build web apps for clients or for themselves that want to get a running start and don’t want to waste 60+ hours writing the same code.
  • Entrepreneurs that want to build web apps and/or startups quickly and don’t want to waste 60+ hours rewriting boring code
  • Wantrepreneurs that want to create a quick MVP to prove their concepts and are held back by the all the BS stuff they have to code just get to the fun stuff.

Why do you need it?
How many sites have you built a website before?  What are the common features that you keep implementing over and over and over?  What are the parts that you wish were just built so you can focus on your business idea instead of the generic stuff?  I built and continue to build a lot of websites myself and I find myself repeating the same things several times.  Sure, I will copy and paste a few things here and there or refactor some of it into some reusable library, but I still end up doing things over several times.   I want something to get me started quickly on the next project.  I ran into hackerengine.com a few months ago and thought “wow, that is freaking cool.  I wish they had it in .net”.  There is no .net equivalent, so I am building one.

UPDATE: I just realized that hackerengine is shutting down – this must have just happened because I was on their site 2 days ago.  I guess there are 2 ways to look at this: 1 – there is not enough demand or 2- I have one less competitor to worry about.

The first thing I did is mind map the common features that I need in almost all web projects that I build.  Here is a short list of the most important features that came to mind:

  • User management: login, signup, password reset, forgot password, email verification, beta invitation code
  • Email integration with Sendgrid (you can plugin whatever you need), email templates
  • Payment managementStripe integration for payment processing, product selling, subscription selling, promo codes and so on.  Everything related to payment will work out of the box, all you gotta do is add your products or subscription plans in configuration and you are done
  • Analytics – Integration with KISSmetrics - http://www.kissmetrics.com/ to track and measure all the important events (login, signup, view plan, subscribe, etc…)
  • Affiliate management – affiliate, sign up, login, stats, payment, all working right out of the box to help you grow your business very quickly
  • Admin Site – A kick-ass admin control panel that will allow you to do all kind of things: ban users, send invitation codes, setup coupons, products, plans, email users, etc…
  • And a lot more

Questions: what do you think of these features?  Too much?  Not enough?  Just right?

What does it cost?
Well, what is 60 hours of work worth to you?  What would you pay to have all these things working on day one so you can focus on your REAL app?  $300, $500, $1000.  Seriously though, we are thinking of pricing it around the $299 to $499 range – any suggestions?

What do you get and how?
When you buy StarterWeb, you will receive the SOURCE CODE, specifically, you will receive direct access to our code repository.  You can do whatever you want with it EXCEPT sell it as a template or open source it i.e. you won’t be able to buy it, and re-sell it or give it away as starterweb.org – NOT COOL :).  The code is unit tested with 100% coverage with lots of integration testing for the most common scenarios.

What is the technology stack?

  • ASP.NET MVC 4 (Razor + C#) – because the .net community needs love too
  • JQuery
  • Knockout JS
  • Twitter Bootstrap
  • SQL backened – the data layer is written using the IRepo pattern and you pretty much can plugin any database you like – I might implement a Mongo DB layer if there is enough demand.
  • NUnit

Do you have a demo?
I am glad you asked.  Here is a demo that I deployed ta Azure in less than 20 seconds.  Side note: I have previously complained about the terrible deployment story on Azure but I gotta say, Microsoft gets it right again (on the 3rd version).   I was able to deploy to Azure in under a minute using git – FREAKING AWESOME.

Remember this is only 1 week old (working part time on it), but it has the following features:

  • Login
  • Signup
  • Reset password
  • Email verification
  • “Beta” invitations

See it at http://starterweb.azurewebsites.net/ - you can signup using the invitation code “mvp“.

You can’t wait?  Want it right now?
Let me know at @eibrahim or eibrahim @ gmail and you can pre-buy it for a discounted price of $149 which gives you a license to use it on 1 website (domain).  You will get a say in the direction the project goes and you will get direct read access to the source code repository.

Thanks and please, please, please, give us feeback.

Code Retreat

A few weeks ago, I took what I called a code retreat.  Basically, with my awesome wife’s blessing, I decided that I will spend the weekend locked up in the basement and code all weekend.  It was fantastic.  It was glorious.  It was so much fun.  I literally went down Friday evening with my computer, food, water, headphones and a bunch of other things I might need and didn’t come out until Sunday night.

Rules of Code Retreat

  • No Phone – I actually put it on airplane mode
  • No Email – I checked my email once all weekend, not bad for someone who is used to checking it every 20 seconds
  • No Social Networking – I am not a big fan, so that was not that hard
  • No Hacker News – that one was tough, by the end I was starved for my HN fix
  • No Wife – we agreed that she will only contact me if there was an emergency
  • No Family and/or Friends – I told most people that I regularly contact that I will be out of touch all weekend
  • No Beer – I don’t care how much you love it.  It will impair your coding skills.
  • No YouTube, no TV, nothing….
  • ONLY PANDORA with a nice pair of headphones

Why Code Retreat?

Do I need a reason to code?  No.  That in and of itself is enough to get me excited.  I love coding, I love creating new projects and  I love learning new things.  Those are enough reasons.  But what I really wanted is to be completely focused for a significant amount of time without any distractions.  By scheduling a code retreat for a weekend, I am committing myself to doing that and it worked.  I have coded like I have never coded before – well at least since I was fresh out of school.  It was a great experience and I have decided to do it once every 2 or 3 months – it might be easier/harder depending on your situation but you should try it out.  You will like it.

Efficient Code Retreats

Well, it’s not like I am experience code retreater – I have only done it once.  But here are some things that I did that I thought were helpful.

Plan It In Advance

I had a running list and mind map weeks in advance of things that I should do or consider doing in the code retreat.  I kept adding to it whenever an idea came to my mind.

Decide A Project

I reviewed my plans a week or two before and made final decisions on what to do and what to skip.  I had several ideas, some of them included learning new languages or new tools others involved using the tools and knowledge that I already have.  I was dying to do a metro app for Windows 8 but since I only had a weekend and there were so many unknowns and the need to use new beta tools – I decided against it because I had a limited amount of time – less than 48 hours.

I decided to do a web-based project.  I am well versed in ASP.NET MVC and my knowledge is current, so there will be no learning curve and will be mostly execution.  Again, I had to filter through a list of ideas from the unrealistic and crazy to the more realistic and pragmatic ones.  It would be cool to claim “I built a social network in a weekend” but we all know that is very hard to do.  More about what I actually ended doing later…

Set A Goal

Once I reviewed my running lists and decided on what project/task to handle, it was time to set a goal.  My goal was to build the application and deploy it by Sunday i.e. in less than 48 hours.  Once I started, I quickly realized that I am not as good as I think I am and coding does take time after all.  You would think after 12+ years of doing this, I would know but I still under estimated the effort.  No wonder many projects get delayed due to bad estimation.  In hindsight that was very optimistic and an unrealistic goal but it gave me something to work towards.  I had to prioritize my list and get the big-impact items done first so I can meet my deadline.  Spoiler alert – I didn’t meet the deadline.

Mistakes To Avoid

I think my biggest mistake was a technical one.  I mistakenly decided to use Azure for hosting.  It has come a long way form the last time I tried a couple of years ago.  But once I started deploying I realized how F%#@! painful it is.  It takes like 20 minutes to deploy an app, so it was extremely difficult to rapidly fix bugs.  On the other hand, I can deploy to AppHarbor in literally 20 seconds.

Unrealistic goals, is another mistake I made.  I aimed too high and failed to accurately estimate the effort it would take to get this done and didn’t account for unforeseen technical difficulties.

Marketing

We all know that we suck at marketing but we still try…  and fail.  Personally, I have a lot of respect for marketters and marketing but my idea of marketing goes like this:

  1. Build product/widget/app/website
  2. Get it on hacker news and reddit
  3. Become rich and famous

It can’t be that hard.  Right?  Wrong.  I have tried it before with very limited success.  Unfortunately, I don’t know how much better I can do it this time.  So, I am going to focus on making a good product, blogging about it, tweeting it and emailing some friends about it.  Other than that, I am not going to do much.  If I see some traction, I will consider other options, perhaps reaching out to some bloggers, actively promoting through my blog and maybe even pay for some ads (highly unlikely) …

Show Me… Show Me

Well, I am not ready to show you yet but I am very close…  If you want to be notified, you can click here or follow me on twitter @eibrahim.  You might even get some free subscription or swag for being an early adopter.

Leave comments over here http://news.ycombinator.com/item?id=3849080

30 Days of Rails

If you haven’t noticed, I am a .net developer but I was inspired today by Matt Cutt’s TED talk to start a 30-day project.  I highly recommend watching it; it might inspire you too.

 

So I have decided to spend 30 days with Ruby on Rails and blog it right here. Stay tuned for a daily post on rails, it will be fun.  I am starting my journey with TekPub’s Rails 3 production at http://tekpub.com/view/rails3/1

Nodejs on Windows

This turned out to be easier than expected.

Step 1: Download node.exe

Get it from http://nodejs.org/#download and put it somewhere in your path e.g. c:\node

Step 2: Install git

Get it from here and install into your windows console if you want to use the windows command prompt instead of bash

Step 3: Install NPM (node package manager)

This one is a little more involved.  Run the following commands (ref: http://npmjs.org/doc/README.html#Installing-on-Windows-Experimental)

git config –system http.sslcainfo /bin/curl-ca-bundle.crt
git clone –recursive git://github.com/isaacs/npm.git
cd npm
node cli.js install npm –gf

Step 4: Install express

Express is a really cool web framework for nodejs and should simplify your web development considerably.  This is of course optional, but here are the steps anyway.

create a folder for your app e.g c:\projects\myapp

cd c:\projects\myapp

npm install –g express

node app.js

Now, if you visit http:/127.0.0.1:3000 you will see a 500 error page because you are missing a dependency.  npm install –d should fix it but that threw all kinds of errors in windows “couldn’t unpack blah blah”, “unknown error blah blah”, “out of memory blah blah”…  Fortunately, running this command downloaded the missing dependency (jade) into the temp folder, on my machine it was at C:\Users\Emad\AppData\Local\Temp\npm-1320719310093\1320719310093-0.5456247869879007\contents\___package.npm\package (if it is not there, you can get it from https://github.com/visionmedia/jade)

I copied the content of that folder into C:\node\node_modules\jade and that took care of the problem.  Now visiting http://127.0.0.1:3000/, I see

Step 5: Install linux in a Virtual machine

Yes, you read that right.  It is just much simpler to work with node stuff on linux.  Everything just works.  It seems like on windows, you are constantly swimming upstream.