This is a feeling I’ve noticed from engineers and designers I’ve worked with in the past, and it’s a sentiment that’s a lot more transparent with the broader web community at large. You can hear it in Medium posts and on indie blogs, whether in conversations about CSS, web performance, or design tools.

The sentiment is that front-end development is a problem to be solved: “if we just have the right tools and frameworks, then we might never have to write another line of HTML or CSS ever again!” And oh boy what a dream that would be, right?

Well, no, actually. I certainly don’t think that front-end development is a problem at all.

Material Dashboard is a free Material Bootstrap Admin with a fresh, new design inspired by Google's Material Design. We are very excited to introduce our take on the material concepts through an easy to use and beautiful set of components. Material Dashboard was built over the popular Bootstrap framework and it comes with a couple of third-party plugins redesigned to fit in with the rest of the elements.

Material Dashboard makes use of light, surface and movement. The general layout resembles sheets of paper following multiple different layers, so that the depth and order is obvious. The navigation stays mainly on the left sidebar and the content is on the right inside the main panel.

This is more in line with more modern design guidelines like those found in Material Design, which has become hugely popular the last couple of years.

Boostrap v3 had too few breakpoints for its grid, in my opinion, as the lowest one, xs, was at 768 px. A lot of traffic usually comes from screens narrower than that, so this has been frustrating for many developers.

So now they’ve added a new breakpoint, xl. This one takes the role lg used to have, and pushes the rest of the breakpoints downwards, making the range go all the way down to 576 px.

CSS Grid is a new way of creating layouts on the web. For the first time ever we have a proper layout system available natively in the browser, which gives us a ton of benefits.

These benefits become especially clear if you compare CSS Grid to the most popular framework of them all: Bootstrap. Not only can you create layouts that previously wasn’t possible without introducing JavaScript, but your code will be easier to maintain and understand.

In this article I’m going to explain why.

I‘m also working on creating a free in-depth CSS Grid course, which I’ll launch in December.

Bootstrap has a way to define grids and rightly place content on it too. This is what is called the Bootstrap grid system.

For more advanced users, It is important to note that you don’t need horizontal or vertical grid lines. With the CSS Grid sprinkled with some CSS magic, you can easily build a non-conventional layout.

The Bootstrap 4 grid is built with Flexbox — which makes it even more powerful than ever before.

Fair warning: this part of Bootstrap tends to suck when you first learn it. But, if you take the time to master the Bootstrap grid system, you’ll find it to be one of the most important Bootstrap knowledge you have.

Probably if you are updated with the news abroad the front-end community you know that Bootstrap 4.0-alpha6 was released. But what actually was changed for us developers?

The alpha version is obviously incomplete still and shouldn’t be used just yet on production, they are still changing the syntax, adding and removing features, so it’s just a preview for you, I not recommend you to use yet in production projects, just in hobby projects to getting used.

Bootstrap’s now uses SASS! In older versions, it used Less as its main preprocessor. It wasn’t even until version 3.0 that a Sass port was created.

Personally, I don’t like it.Material UI had performance problems, but according to 3.0 release performance was improved.

I’m sure you know about Electron framework. If you’re interested in UI components for cross-platform desktop apps then React-Desktop is for you. You can find UI components for Mac OS and Windows 10 both.

Personally, I think it’s the best UI framework for React.

Semantic-UI-React— is the official clone of Semantic-UI for React. It has almost all most used components from Semantic-UI, but also it has a very good Declarative API,shorthand props for React components, and this UI framework is jQuery free.

In March, Mozilla released Firefox 52, which added support for CSS Grid Layout. If you aren’t familiar with CSS Grid, it is a two-dimensional layout system for the web that allows us to create layout patterns natively in the browser. This means we can easily recreate familiar grids using just a few lines of CSS. It also means we can do a whole lot with CSS and layouts that wasn’t possible before… but more on that in a bit.

A quick note: This post isn’t meant to be a comprehensive primer for CSS Grid, and assumes a basic familiarity with CSS Grid. If you haven’t already, I’d recommend checking out the fantastic

In 2017, the question is not whether we should use a responsive design framework. Increasingly, we are using them. The question is which framework should we be using, and why, and whether we should use the whole framework or just parts of it.

With dozens of responsive design frameworks available to download, many web developers appear to be unaware of any except for Bootstrap. Like most of web development, responsive design frameworks are not one-size-fits-all. Let’s compare the latest versions of Bootstrap, Foundation and UIkit for their similarities and differences.

Our mission at Tutorialzine is to keep you up to date with the latest and coolest trends in web development. That’s why every month we release a handpicked collection of some of the best resources that we’ve stumbled upon and deemed worthy of your attention.

Propeller is a CSS components framework based on Bootstrap and Google’s Material Design language. It includes 25 components made with responsiveness in mind and featuring the typical Material Design animations. The project can be downloaded as a theme for Bootstrap, a full framework, or as stand alone components.