Menu Search
Jump to the content X X
Smashing Conf New York

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

Posts Tagged ‘Techniques’.

We are pleased to present below all posts tagged with ‘Techniques’.

An Introduction To Redux

Redux is one of the hottest libraries in front-end development these days. However, many people are confused about what it is and what its benefits are. As the documentation states, Redux is a predictable state container for JavaScript apps. To rephrase that, it's an application data-flow architecture, rather than a traditional library or a framework like Underscore.js and AngularJS.

An Introduction To Redux

Redux was created by Dan Abramov around June 2015. It was inspired by Facebook’s Flux and functional programming language Elm. Redux got popular very quickly because of its simplicity, small size (only 2 KB) and great documentation. If you want to learn how Redux works internally and dive deep into the library, consider checking out Dan’s free course.

Read more...

Stylelint: The Style Sheet Linter We’ve Always Wanted

Everyone wants a clean, consistent code base, no matter the language. Developers are accustomed to setting up linters in programming languages such as JavaScript and Python, but they rarely use a linter for style sheets. In this article, we’ll look at stylelint, a linter for style sheets.

Stylelint: The Style Sheet Linter We've Always Wanted

We will also learn why linting a style sheet matters, how stylelint brings order to a style sheet and how we can avoid errors. Finally, we will learn how to use stylelint and start linting as soon as possible. Let's start with why linting is important.

Read more...

Sponsored Post Looking Back: One Year Of Microsoft Edge (Videos)

Change is difficult in large corporations. But sometimes it is possible. In fact, we published Inside Microsoft’s New Rendering Engine For The “Project Spartan” when the new browser was just announced. A year has passed since then. We kindly thank Microsoft for keeping Smashing Magazine alive and supporting the community with technical articles on practical JavaScript techniques, open source projects and interoperability best practices. Our editors are working with Microsoft engineers to deliver useful insights to you. — Ed.

microsoft-edge-browser-usage-share-preview

In 2015, Microsoft launched its first new browser in 20 years: Microsoft Edge. After eight months, it's on a great trajectory for web standards support, but there are many exciting features to come. This article is part of the web development series from our tech evangelists and engineers on JavaScript skills, community projects and best practices including Microsoft Edge browser and the new EdgeHTML rendering engine.

Read more...

Why You Should Stop Installing Your WebDev Environment Locally

Have you heard of Docker but thought that it’s only for system administrators and other Linux geeks? Or have you looked into it and felt a bit intimidated by the jargon? Or are you silently suffering with a messy development environment that seems to break all of the time in various mysterious ways? Then read on. By the end of this article, you should have a basic understanding of Docker and have it working on your computer!

Why You Should Stop Installing Your WebDev Environment Locally

The first part of this article gives a bit of background to help you understand the concepts behind Docker through some metaphors. But if you just want to get started with the tutorial, skip to the “Time to Play!” section.

Read more...

Houdini: Maybe The Most Exciting Development In CSS You’ve Never Heard Of

Have you ever wanted to use a particular CSS feature but didn’t because it wasn’t fully supported in all browsers? Or, worse, it was supported in all browsers, but the support was buggy, inconsistent or even completely incompatible? If this has happened to you — and I’m betting it has — then you should care about Houdini.

Houdini: The Most Exciting Development In CSS You’ve Never Heard Of

Houdini is a new W3C task force whose ultimate goal is to make this problem go away forever. It plans to do that by introducing a new set of APIs that will, for the first time, give developers the power to extend CSS itself, and the tools to hook into the styling and layout process of a browser’s rendering engine.

Read more...

Building A Real-Time Retrospective Board With Video Chat

If you’ve ever worked in an agile environment, chances are you’ve had your share of “retrospectives” — meetings where people write what made them “glad,” “mad” or “sad” onto different-colored notes, post them onto a board, arrange them in groups and — most importantly — talk about them.

How To Build A Real-Time Retrospective Board With Video Chat

These meetings are straightforward, as long as everyone is in the same room. But if you’re working with a locally distributed team, things can get a bit tricky. Let’s address this by creating a virtual version of our board to allow team members in different locations to hold their retrospective just as if they were in the same room.

Read more...

Building A First-Class App That Leverages Your Website: A Case Study

Mark Zuckerberg once said, “The biggest mistake that we made, as a company, is betting too much on HTML5 as opposed to native… because it just wasn’t there. And it’s not that HTML5 is bad. I’m actually, long term, really excited about it.” And who wouldn’t be excited by the prospect of a single code base that works across multiple platforms?

The app as a mix of native and web interfaces

Unfortunately, Facebook felt that HTML5 didn’t offer the experience it was looking to build, and that’s what it’s really about: the experience. I believe what Mark was really trying to say was that their biggest mistake was making a technology-driven decision instead of a user experience-driven decision. At the end of the day, we should be making decisions that deliver value to our customers, and sticking to a particular technology is generally not the best way to achieve that.

Read more...

Making A Service Worker: A Case Study

There’s no shortage of boosterism or excitement about the fledgling service worker API, now shipping in some popular browsers. There are cookbooks and blog posts, code snippets and tools. But I find that when I want to learn a new web concept thoroughly, rolling up my proverbial sleeves, diving in and building something from scratch is often ideal.

Making A Service Worker: A Case Study

The bumps and bruises, gotchas and bugs I ran into this time have benefits: Now I understand service workers a lot better, and with any luck I can help you avoid some of the headaches I encountered when working with the new API.

Read more...

Responsive Image Breakpoints Generator, A New Open Source Tool

Responsive websites, even the most modern ones, often struggle with selecting image resolutions that best match the various user devices. They compromise on either the image dimensions or the number of images. We can solve these issues and start calculating image breakpoints more mathematically, rather than haphazardly.

Responsive Image Breakpoints Generation: Challenges, Mistakes And A New Solution

The lives of web developers aren’t getting any simpler as the number of different devices and potential screen resolutions increase. The high-resolution arms race seems to be never-ending as vendors try to top one another with innovations in laptop and mobile device screens. New devices such as TVs and smartwatches are entering the market, making the race even more complex.

Read more...

↑ Back to top