Context: frontend-dev-bookmarks / Ecosystem
Commercial companies and nonprofit organizations around web development.
- Airbnb: Airbnb is a website for people to list, find, and rent lodging.
- Airbnb CSS + Sass Style Guide: This style guide covers Terminology, Rule Declaration, Selectors, Properties, Formatting, Comments, OOCSS and BEM, ID Selectors, JavaScript hooks Sass, Syntax, Ordering, Mixins, Placeholders, Nested selectors.
- Airbnb JavaScript Style Guide: A style guide for writing JavaScript code at Airbnb.
- Enzyme: Enzyme is a JavaScript Testing utility for React that makes it easier to assert, manipulate, and traverse your React Components’ output.
- Polyglot: Polyglot.js is a I18n helper library written in JavaScript, made to work both in the browser and in CommonJS environments (Node). It provides a simple solution for interpolation and pluralization.
- Turbocharged JavaScript Refactoring with Codemods: Joe Lencioni describes how they used codemods to transform a large JavaScript code base at AirBnB
- Box Inc.: Box is an online file sharing and content management service for businesses based in Redwood City, California.
- Leche: A JavaScript testing utility designed to work with Mocha and Sinon. This is intended for use both by Node.js and in browsers, so any changes must work in both locations.
- Nicholas C. Zakas: Former principal front-end engineer at Yahoo! and YUI developer. Leads a team of frontend engineers at Box now.
- Box Tech Talk: Scalable JavaScript Application Architecture: A video by Nicholas Zakas (2012) about JavaScript Architecture.
- Scalable JavaScript Application Architecture: In this video (2011) Nicholas Zakas discusses frontend architecture for complex, modular web applications with significant JavaScript elements.
- T3: T3 is a minimalist JavaScript framework sponsored by Box Inc. that provides core structure to code.
- Shalam: A friendly tool for CSS spriting. Shalam allows you to add Retina-friendly, high-quality image sprites to your website without modifying any markup.
- T3: T3 is a minimalist JavaScript framework sponsored by Box Inc. that provides core structure to code.
- stalker: A jQuery plugin allowing elements to follow the user as they scroll a page.
- Facebook: Facebook is a corporation and online social networking service headquartered in Menlo Park, California, in the United States.
- Immutable.js: Immutable persistent data collections for Javascript which increase efficiency and simplicity.
- React: React is a JavaScript library for creating user interfaces. Many people choose to think of React as the V in MVC. We built React to solve one problem: building large applications with data that changes over time.
- 3 Lightweight React Alternatives: Dan Prince explores Preact, VirtualDom & Deku.
- Block, Element, Modifying Your JavaScript Components: Mark Dalgleish is discussing how to organize React code with BEM and build everything with Webpack.
- CSS Modules To The Rescue.jsx: If you use react-like templates/components, use webpack CSS loader to enable CSS Modules and forget about global CSS problems.
- Find Your Perfect React Starter Project: A simple search engine for React boilerplates with the ability to pick the ingredients.
- Getting to Grips with React (as an Angular developer): In a series of posts Dave Ceddia tries to help you apply your hard-won knowledge of “Angularisms” to React.
- How we use the Flux architecture in Delve: Øystein Hallaråker describes how Delve utilizes the Flux application architecture.
- JSX Transform: JSX transpiler. A standard and configurable implementation of JSX decoupled from React.
- Model-View-Intent with React and RxJS: Satish Chilukuri shows an example implementation of MVI pattern with React.
- React App: React App is a small library powered by React, Universal Router and History that handles routing, navigation and rendering logic in isomorphic (universal) and single-page applications.
- React Components, Elements, and Instances: Dan Abramov explains the Virtual DOM dictionary in React.
- React Demystified: This article is an attempt to explain the core ideas behind React.js and Virtual DOM.
- React Native for Web: This project allows components built upon React Native to be run on the Web, and it manages all component styling out-of-the-box.
- React Starter Kit: Isomorphic web app boilerplate including Node.js, Express, GraphQL, React.js, Babel 6, PostCSS, Webpack, Browsersync.
- React vs Incremental DOM vs Glimmer: In this post we will explore three technologies to build dynamic DOMs. We will also run benchmarks and find out which one is faster.
- React: Rethinking best practices (2013): A video introduction to React by Pete Hunt.
- ReactPerfTool: ReactPerfTool tries to give you a more visual way of debugging performance of your React application. It does this by using the addons delivered by the React team and community to get measurements and visualize this using graphs.
- Redux Form: A Higher Order Component using react-redux to keep form state in a Redux store.
- Removing User Interface Complexity, or Why React is Awesome: In this post James Long tries not to evangelize React specifically, but to explain why its technique is profound.
- Retractor: Retractor exposes the internals of a React application for end-to-end testing purposes. This allows you to select DOM nodes based on the name of the React Component that rendered the node as well as its state or properties.
- The Redux Ecosystem: Let’s take a look at most of the features that you’ll have to deal with when the time comes, — and where React & Redux themselves can’t help you.
- What Developers Need to Know about MVI (Model-View-Intent): The article explains the general MVI pattern and how it relates to React, Reactive Programming and Cycle.js
- Why Did You Update?: A function that monkey patches React and notifies you in the console when potentially unnecessary re-renders occur.
- Why did we build React?: Pete Hunt tries to explain why Facebook devs built React in the first place.
- Google: Google’s mission is to organize the world’s information and make it universally accessible and useful.
- Addy Osmani: Engineer at Google working on open web tooling.
- Learning JavaScript Design Patterns: In this free book Addy Osmani explores applying both classical and modern design patterns to the JavaScript programming language.
- Patterns For Large-Scale JavaScript Application Architecture: An extensive overview by Addy Osmani of existing architectural solutions in the frontend development field.
- Writing Modular JavaScript With AMD, CommonJS & ES Harmony: In this article Addy Osmani reviewes several of the options available for writing modular JavaScript using modern module formats AMD, CommonJS and ES6 Modules.
- Introducing Incremental DOM: Incremental DOM is a library inspired by Virtual DOM developed at Google.
- Addy Osmani: Engineer at Google working on open web tooling.
- Microsoft: Microsoft Corporation is an American multinational technology company, that develops, manufactures, licenses, supports and sells computer software, consumer electronics and personal computers and services.
- Dev Tools by Microsoft: These tools allow you to test your product on different version of Internet Explorer and Microsoft Edge.
- Knockout.js: Knockout is a standalone JavaScript implementation of the Model-View-ViewModel pattern with templates.
- Reactive Extensions (RxJS): RxJS is a set of libraries for composing asynchronous and event-based programs using observable sequences and fluent query operators.
- Async JavaScript with Reactive Extensions: Jafar Husain explains in this video how Netflix uses the Reactive Extensions (Rx) library to build responsive user experiences that strive to be event-driven, scalable and resilient.
- Learn RX: A series of interactive exercises for learning Microsoft's Reactive Extensions (Rx) Library for Javascript.
- Rx-Book: A complete book about RxJS v.4.0.
- RxMarbles: A webapp for experimenting with diagrams of Rx Observables, for learning purposes.
- Transducers with Observable Sequences: A chapter from the RxJS Book describing Transducers.
- Why We Built Xstream: The authors needed a stream library tailored for Cycle.js. It needs to be “hot” only, small in kB size and it should have only a few and intuitive operators.
- Visual Studio Code: Build and debug modern web and cloud applications. VS Code is free and available on your favorite platform - Linux, Mac OSX, and Windows.
- Mozilla: Mozilla is a community, which uses, develops, spreads and supports free software products. It is supported institutionally by the Mozilla Foundation and its tax-paying subsidiary, the Mozilla Corporation.
- Firefox: Firefox is the highly popular free web browser. It is available for Linux, Mac, Windows, handheld devices, and in more than 70 different languages.
- James Long: Works on Firefox Developer Tools at Mozilla.
- A Study on Solving Callbacks with JavaScript Generators: This article describes how Generators help fight callback hell.
- Removing User Interface Complexity, or Why React is Awesome: In this post James Long tries not to evangelize React specifically, but to explain why its technique is profound.
- Transducers.js Library by James Long: A small library for generalized transformation of data (inspired by Clojure's transducers)
- Transducers.js Round 2 with Benchmarks: Refactored version of Transducers.js, some benchmarks, Laziness, the transformer protocoll.
- Transducers.js: A JavaScript Library for Transformation of Data: A post announcing the transducers.js library with some explanation.
- Transducers.js Round 2 with Benchmarks: Refactored version of Transducers.js, some benchmarks, Laziness, the transformer protocoll.
- Transducers.js: A JavaScript Library for Transformation of Data: A post announcing the transducers.js library with some explanation.
- Mozilla Developer Network (MDN): The MDN is a complete learning platform for Web technologies and the software that powers the Web.
- Nunjucks: A rich and powerful templating language for JavaScript.
- Stripe: Stripe is an Irish technology company that allows both private individuals and businesses to accept payments over the Internet.
- Alex Sexton: Alex Sexton is an engineer at Stripe. He is on the Modernizr core team, the jQuery Board of Directors, as well as the Dojo Foundation Board.
- Modernizr: It’s a collection of superfast tests – or “detects” as we like to call them – which run as your web page loads, then you can use the results to tailor the experience to the user.
- Mikito Takada (mixu): Software engineer at Stripe.
- Learn CSS Layout the pedantic way: Walks you through every major concept in CSS layout, without trying to simplify away the underlying mechanisms described in the CSS 2.1 and flexbox specs.
- Single Page Apps in Depth: This free book is what I wanted when I started working with single page apps. It's not an API reference on a particular framework, rather, the focus is on discussing patterns, implementation choices and decent practices.
- jquery.mobilePhoneNumber: A general purpose library for validating and formatting mobile phone numbers.
- jquery.payment: A general purpose library for building credit card forms, validating inputs and formatting numbers.
- Alex Sexton: Alex Sexton is an engineer at Stripe. He is on the Modernizr core team, the jQuery Board of Directors, as well as the Dojo Foundation Board.
- TODO Group: TODO is an open group of companies who want to collaborate on practices, tools, and other ways to run successful and effective open source projects and programs.
- Twitter: Twitter is an online social networking service that enables users to send and read short 140-character messages called "tweets".
- Flight: An event-driven web framework, from Twitter.
- Hogan.js: Hogan.js is a 3.4k JS templating engine developed at Twitter. It was developed against the mustache test suite.
- Nicolas Gallagher: Frontend Engineer at Twitter.
- Normalize.css: A modern, HTML5-ready alternative to CSS resets.
- World Wide Web Consortium (W3C): The W3C is an international community where Member organizations, a full-time staff, and the public work together to develop Web standards.
- Architecture of the World Wide Web: Identification: This architecture document by W3C discusses the core design components of the Web. They are identification of resources, representation of resource state, and the protocols that support the interaction between agents and resources in the space.
- CSS Flexible Box Layout Module Level 1: W3C specification for CSS flexbox.
- Document Object Model (DOM) Technical Reports: Specifications by the W3C.
- Yandex: Yandex is one of the largest internet companies in Europe, operating Russia’s most popular search engine and its most visited website.
- Block Element Modifier (BEM): Methodology aimed at achieving fast to develop long-lived projects, team scalability, and code reuse.
- A New Front-End Methodology: BEM: An introduction by Varvara Stepanova at SmashingMagazine.
- An Introduction to the BEM Methodology: General introduction article on tutsplus.
- Block, Element, Modifying Your JavaScript Components: Mark Dalgleish is discussing how to organize React code with BEM and build everything with Webpack.
- Emmet filter for BEM: If you’re writing your HTML and CSS code in OOCSS-style, Yandex’s BEM style specifically, you will like this filter. It provides some aliases and automatic insertions of common block and element names in classes.
- Fifty Shades of BEM: Article describes different flavors of BEM.
- Introduction To BEM Methodology (Toptal): General introduction to BEM methodology and platform.
- MindBEMding – getting your head ’round BEM syntax: Article on csswizardry explaining the BEM syntax for CSS classes.
- Support for BEM modules in Sass 3.3: The next major release of Sass is poised for release and with it comes real support for BEM-style modules...
- To BEM or not to BEM: A series of interviews on BEM methodology.
- Yandex Browser: Chromium based browser developed by Yandex.
- Block Element Modifier (BEM): Methodology aimed at achieving fast to develop long-lived projects, team scalability, and code reuse.
- Zurb: ZURB is a product design company since 1998. Through consulting, product design tools and training, they transform the way businesses approach Progressive Design.
- Foundation: Foundation provides a responsive grid and HTML and CSS UI components, templates, and code snippets, including typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions.
- Foundation for Emails 2: Frontend Framework for E-Mails including a grid, global styles, aligment classes, buttons, callout panels, thumbnail styles, typography, visibility classes.
- Responsive Email Templates: Zurb Studios put together this set of super awesome email templates so that you can make your email campaigns responsive.
This work is licensed under a Creative Commons Attribution 4.0 International License.
Please provide a link back to this repository. This is not necessary for GitHub forks.