Ultimate Collection of Resources for Developers Starting With Bootstrap

A couple of weeks ago, we published a general overview of Bootstrap and its pros and cons. Basically, the goal was to help you decide whether or not Bootstrap is a platform worth using for your next web development project.

Feel free to check that post right now if you haven’t already (link).

Some of you have expressed really strong opinions in the comments section under that post, which only proves that Bootstrap framework remains to be one of the hot topics in the web development world today. So as a follow-up, this time we’re taking a look at some of the most useful Bootstrap developer resources from around the web.

This list goes through various types of information, tutorials, and tools related to Bootstrap framework. I’ve divided it into a handful of categories just to make everything a bit easier to grasp and allow you to skip things you’re not interested in.

Building Angular.js Starter application

We have recently created example Angular.js web app with the minimal generic functionality. Small enough to be called framework but with built-in test cases, controllers and several views with user forms. The goal is to have a reusable foundation for Angular projects. This blog post is about how we designed Angular Starter structure.

Why Angular Starter

There are many tutorials on how to start application development with Angular.js. As well as a good few projects on GitHub with the Angular app skeletons. Like the angular-seed project created by Angular.js development team itself.

What we needed was a minimal project, with pre-built basic functionality and structure of communication with web services and APIs. And of course automated test cases.

We wanted test cases to get some special attention as we are big fans of TDD (test-driven development). Having the majority of test cases created even before any app functionality is coded is a good help to keep those bugs away.

I haven’t found the open source project which completely match my requirements and Angular Starter was born. It’s an open source project, hosted on GitHub and I welcome all suggestions and comments.

What exactly is its structure and how it can help to start your Angular apps?

Framework7 and Parse for User login

This is the the second tutorial about building Framework7 HTML5 mobile web application. In the first tutorial part we have prepared the base by creating 3 mobile application views. One of them was app user login view. In this tutorial part we will make user registration and login functionality live by enabling login view communication with Parse – cloud based backed service.

Creating Parse User Database

Now days you have many options once it comes to cloud based storage options for mobile web apps. We did a good summary on HTMLCenter a few posts ago.

For todays tutorial we are using Parse service. Parse at the time or writing supports 3 main functions – Core for data storage and user management, Push for push notifications and Analytics for logging different app events. They have free tier available for starting apps – it allows for up to 30 requests per second throughput and has 2TB data transfer limit per month. I’m sure we will not need this capacity in our tutorial!

Go ahead and create a free account on Parse. After you signup / login you can create new applications. I created one called framework7test dedicated for this tutorial. You can see it below.

What is 2 way binding in Angular.js

Many developers name 2 way binding as the main advantage of Angular.js framework. So what 2 way binding actually is and how it helps Angular.js framework to deliver better experience?

1 way data binding

The below images explain the difference quite well.

In MVC (model, view & controller) world 1 way data binding happens when controller generates view by merging model and view template. This process happens once and generated view is then sent to the client application. Once client application receives rendered view there is no easy way to automatically update this view if model data changes.

View is only regenerated once user refreshes the the app screen / page with current view. Or navigates to another application page.

The Bootstrap Framework Controversy … Should You Use It or Not?

Released back in 2011, Twitter’s Bootstrap framework is one of the most popular – if not the most popular – front-end website development framework out there, at least in 2015.

And not without a reason. Bootstrap provides a really easy to grasp way of crafting your site designs and thus allows you to create great looking and mobile-optimized builds in hours, instead of days.

Bootstrap should you use this framework

That being said, there’s a lot of conflicting opinions around Bootstrap with almost equal number of people on both sides of the barricade. Some experienced developers (like the guys over at ThemeShaper, for example) have addressed various issues with the framework and pointed out why it might not be the perfect web development solution after all.

So today, let’s look into some of the framework’s known traits, both in terms of the positives as well as the negatives. However, I’ll try not to sway your opinion in any direction by telling you what I consider the right solution here – in terms of using Bootstrap or not – but instead, I just want to provide enough insight for you to be able to make your own decision.

HTML5 frameworks for mobile web applications

We are starting the series of tutorials and short reviews about popular HTML5 mobile frameworks. In this post we are discussing why would developers use existing mobile web framework instead of building one from the ground up.  And we are creating simple mobile web application with Framework7. The second tutorial part we use Parse.com cloud service to integrate user login.

Mobile web applications allow us to quickly design and develop prototypes, reuse already written code across multiple mobile platforms and in many cases match look & feel for customers using wide range of devices with different operating systems.

Pages: