Node Hero - Node.js Security Tutorial | @RisingStack
Learn how to defend your applications against the most common attack vectors from this Node.js security tutorial. 11th part of the Node Hero series.
nodejs  node  security  javascript  coding  tips 
Getting Started with TDD in React – Angularity
A step-by-step tutorial for testing React with Enzyme.
testing  javascript  coding  reactjs 
5 days ago
3 simple steps to improve your React Redux code | Cheesecake Labs
Learn how to improve your React Redux code and ensure its scalability and maintainability in the long run through 3 simple steps.
redux  reactjs  coding 
5 days ago
React.js in patterns
Long time I was searching for a good front-end framework. Framework that will help me write scalable and easy to maintain UI. Even though React is just a library for rendering it comes with so many benefits that I can easily say “I found it”. And like every thing that I use a lot I started seeing some patterns. Techniques that are applied over and over again and I see in the code of other developers. It’s time that I start documenting, discussing and sharing these patterns.

All the techniques described here are available in repository. I’ll probably not update this blog post but will continue publishing stuff in GitHub. I’ll also encourage you to comment below, file an issue or directly make a pull request with patterns that you recognize.
reactjs  coding  javascript 
6 days ago
I’m Voting For The Democrat In November Because I’m Not A Human Tire Fire — Medium
I’m Voting For The Democrat In November Because I’m Not A Human Tire Fire
This is for anybody wasting time online blathering about how Hillary and Trump are the same; how if Hillary gets the nomination, they won’t vote at all; or how they’re super-stoked to vote for a third party candidate because THEY HAVE PRINCIPLES, GODDAMMIT.
Hi. I’m your Auntie Sara. Time to wake the fuck up. If you are decent, you are going to vote for the Democrat in November. Not because you love Hillary (or Bernie, for whom I will vote if Hillary doesn’t get the nomination!) Not because you love the two-party system (I don’t! Do you? That’s weird! We deserve better!) But because we’re dealing with brass tacks reality here, not our dreams.
clinton  elections  politics  presidents 
7 days ago
The PocketLab | Wireless sensor for STEM education and makers.
PocketLab connects with a single button to a smart phone, tablet, Chromebook, or computer and instantly streams data that you can see and record. PocketLab measures motion, acceleration, angular
for-kids  learning  Science  neat  to-buy 
7 days ago
What is this? Rollup is a next-generation JavaScript module bundler. Author your app or library using ES2015 modules, then efficiently bundle them up into a single file for use in browsers and
javascript  webdev  coding 
10 days ago
2016 Election Forecast | FiveThirtyEight
2016 Election ForecastElectoral votesElectoral votes310.8Popular vote46.9%
10 days ago
Material Kit by Creative Tim
bootstrap  templates  coding  material-design  ui 
12 days ago
Building React Components Library (Conf Edition) // Speaker Deck

React provides a great foundation for building and implementing reusable components, that whole team (and community) could greatly benefit from. But to make the code actually reusable, it should be properly presented and documented. Robert will guide you through the key patterns of building React components library with proper navigation, rendered components sandbox and API description.
components  coding  react  reactjs 
14 days ago
You might not need React Router — Medium
If you happened to work with Facebook’s React.js library for a while, you might notice a few misconceptions floating in the React community. One of them is the affirmation that React is just V from
16 days ago
Jank Free: Let's Make the Web Silky Smooth!
Strapped for time or just getting started with eliminating jank from your projects? These are our must-see resources!
18 days ago
Bing Maps Tile System
Bing Maps provides a world map that users can directly manipulate to pan and zoom. To make this interaction as fast and responsive as possible, we chose to pre-render the map at many different levels of detail, and to cut each map into tiles for quick retrieval and display. This document describes the projection, coordinate systems, and addressing scheme of the map tiles, which collectively are called the Bing Maps Tile System.
mapping  maps  coding  quads 
20 days ago
Create and Verify JWTs with Node.js
JWT, access token, token, OAuth token.. what does it all mean?? Properly known as
javascript  nodejs  coding  node 
22 days ago
mysql - How can an SQL query return data from multiple tables - Stack Overflow
This answer covers: Part 1 Joining two or more tables using an inner join (See the wikipedia entry for additional info) How to use a union query Left and Right Outer Joins (this stackOverflow answer
databases  sql 
24 days ago
How three dots changed JavaScript: spread operator and rest parameter
Spread operator and rest parameter are great additions. The article explains how they improve array literals, array destructuring and function arguments handling.
ES6  tips  javascript  coding 
26 days ago
How to set NODE_ENV to production/development in OS X - Stack Overflow
Before running your app, you can do this in console, export NODE_ENV=production Or if you are in windows you could try this: SET NODE_ENV=production or you can run your app like this:
nodejs  node  coding 
27 days ago
How To Efficiently Display Large Amounts of Data on iOS Maps
This tutorial will demonstrate how to handle and display thousands of points of data on an iOS map in a way people understand and enjoy.

We are going to make an iOS app which ships with 87,000 hotels, each with a coordinate, a name and a phone number. This app will never ask the user to “redo search in area”; it will update the map as the user pans and zooms, allowing the user to freely explore the data.

This will require us to come up with an ultra quick data structure built for the task. We will need to build it in C for it to be performant. Once we have constructed our data structure we will come up with a clustering system, as to not overwhelm the user. Finally, we will give it the professional polish that is required for apps to compete in today’s market.

By the end of this tutorial you will have all the components needed to make this app:
maps  quadtree  data-structures 
27 days ago
Awesome React Boilerplates -
Not interested in reinventing the wheel? Neither am I. Here’s a short list of awesome React boilerplates – sometimes knows as starter kits, seeds or skeletons – for getting React-based applications off the ground in a hurry. These application templates were not taken from any list, however awesome that list might be. Rather, they’ve gained enough mindshare to find me outside The Stream1. They’re open source and waiting for you to clone, fork and build upon for your next React project.
react  javascript  coding  reactjs  boilerplate 
28 days ago
D3 Garden | Interactive D3 Tutorial
Master the fundamentals of D3 with this interactive tutorial Get Started D3 Garden Discover More Popular Tutorials Set the bounds for your garden! Resize this box to begin to your preferred bounds to
javascript  D3.js 
5 weeks ago
nathanuphoff/Glimpse-JS: A tiny library to make loading images appear instantanious.
Glimpse JS is a dependency-free image library to create image previews that load in an instant.

Inspiration was drawn from Facebook and Medium where tiny placeholder images are rendered blurry, until the actual full-size completes loading. This technique greatly reduces perceived load time, and gives page visitors a glimpse of an image instead of a blank space.

Image previews are encoded with a propitiatory data-string optimised for compression. Alternatively, a base64-encoded image can be passed to the image-decoding methods. While encoding image previews, optional parameters can be set for image quality, and conversion to monochrome.

To blur a preview image CSS filter-support is required.

Glimpse JS was formerly known as Reveal JS, but it has come to my attention this name was already taken by another established library.
images  javascript  css  tools  library 
7 weeks ago
Enzyme: JavaScript Testing utilities for React — Airbnb Engineering & Data Science — Medium
Testing code is crucial for the maintainability of a complex code base, but it is just as important that tests are easy to write, maintain, and understand. Frontend code is no exception to this rule, and behaviors that live in your UI should be tested as well.
Almost three months ago, Airbnb open sourced Enzyme, a JavaScript library for testing React components. Since then, the reception has been extremely positive, currently with over 3,000 stars, and over 50 contributors, 45 of which are outside of Airbnb.
Historically, testing UI has been hard to accomplish for a variety of reasons, but using React removes a lot of these hurdles. We hope that enzyme does a good job removing the remaining ones!
tdd  testing  react  enzyme  reactjs 
7 weeks ago
Testing React Components with Enzyme and Mocha - Semaphore
React has become an increasingly popular and widely-used JavaScript application tool for developing web applications. Popular frameworks like Angular.js, Ember.js, and Backbone have traditionally been go-to choices for front-end application development, but React came onto the scene in 2013 and provided front-end engineers with another substantial alternative.

React was developed at Facebook in part as a response to what seemed to be a particularly complicated codebase. As such, it has simplicity baked into its design and API. With this simplicity come some key differences from libraries and frameworks in the same space. Despite some fundamental differences, React applications need testing just like any other software. We will take a quick look at React and some tools you can use to test React components.
tdd  testing  react  reactjs 
7 weeks ago
Fullstack React 🐬: How to Write a Google Maps React Component
Integrating React with external libraries like Google or Facebook APIs can be confusing and challenging. In this discussion, we
maps  react  javascript 
9 weeks ago
Learn JavaScript: — JavaScript Scene — Medium
There are so many JavaScript resources available out there, it
9 weeks ago
Explore Styles - Snazzy Maps - Free Styles for Google Maps
Snazzy Maps is a repository of different color schemes for Google Maps aimed towards web designers and developers.
styles  googlemaps  maps  css 
9 weeks ago
dimaip/server-side-rendering: Interactive guide to server-side rendering with Webpack, React, React Transmit, CSS modules and more
server-side-rendering - Interactive guide to server-side rendering with Webpack, React, React Transmit, CSS modules and more
webdev  css  coding  reactjs  react 
10 weeks ago
MostlyAdequate/mostly-adequate-guide: Mostly adequate guide to FP (in javascript)
About this book This is a book on the functional paradigm in general. We'll use the world's most popular functional programming language: JavaScript. Some may feel this is a poor choice as it's
webdev  reading  programming  coding  javascript 
10 weeks ago
Using JSON Web Tokens as API Keys
Most APIs today use an API Key to authenticate legitimate clients. API Keys are very simple to use from the consumer perspective: You get an API key from the service (in essence a shared secret). Add
node  api  nodejs  coding  tutorial 
11 weeks ago
The Ins and Outs of Token Based Authentication | Scotch
IntroductionToken based authentication is prominent everywhere on the web nowadays. With most every web company using an API, tokens are the best way to...
webdev  tokens  coding 
11 weeks ago
An Ultimate Guide To CSS Pseudo-Classes And Pseudo-Elements – Smashing Magazine
Hola a todos! (Hello, everyone!) In my early days of web design, I had to learn things the hard way: trial and error. There was no Smashing Magazine, Can I Use, CodePen or any of the other amazing
coding  front-end  css  webdev  css3 
12 weeks ago
FuYaoDe/react-native-app-intro: react-native-app-intro is a react native component implementing a parallax effect welcome page using base on react-native-swiper , similar to the one found in Google's app like Sheet, Drive, Docs...
react-native-app-intro is a react native component implementing a parallax effect welcome page using base on react-native-swiper , similar to the one found in Google's app like Sheet, Drive, Docs...
react-native  coding  iOS  reactjs 
12 weeks ago
IonicaBizau/scrape-it: A Node.js scraper for humans.
scrape-it - :crystal_ball: A Node.js scraper for humans.
nodejs  node  github  coding  node.js 
12 weeks ago
Coderwall | Creating full width (100% ) container inside fixed width
A protip by praveenvijayan about css, layout, and viewport width.
design  css  coding 
april 2016
StockFighter Programming Game
Stockfighter has a JSON/REST API for players to trade with our simulated stock exchanges. Docs/code samples/in-line API explorer.
games  programming  coding 
april 2016
Synaptic - The javascript neural network library
The javascript architecture-free neural network library for node.js and the browser
neural-network  coding  javascript 
april 2016
Redux best practices — Lexical Labs Engineering — Medium
Redux is the React framework that other flux frameworks recommend you use. It went 1.0.0 when I started writing this (and is at the time of publishing past 3.0.0!) and it’s still early days as to how to use it.
Its author, Dan Abramov, has put together some great documentation, but it doesn’t yet fully address how to deal with engineering with Redux at scale — people are starting to ask, “are there any repos of non-trivial apps that use redux”. Well, hopefully this goes somewhere to it.
We’ll talk about:
the full tech stack
what each part of Redux ends up doing
how to lay out a Redux project
how to handle async data with WebSockets.
redux  javascript  coding  react 
april 2016
jw84/messenger-bot-tutorial: Facebook Messenger bot 15 minute tutorial
Facebook recently opened up their Messenger platform to enable bots to converse with users through Facebook Apps and on Facebook Pages.

You can read the documentation the Messenger team prepared but it's not very clear for beginners and intermediate hackers.

So instead here is how to create your own messenger bot in 15 minutes.
nodejs  coding  bots  facebook  examples  tutorial  javascript 
april 2016
Atom: local-history
Local History for Atom: Atom package for maintaining local history of files (history of your changes to the code files).
plugins  Atom  IDE  coding  tools  packages 
april 2016
niftylettuce/rapid-mvp-standards: Rapid MVP Standards for App Development, Design, Project Management, Launch, Testing, Analysis, Growth, and Funding
TLDR; This is a no-BS document defining rapid MVP standards. It is based on my experiences, successes/failures over the past eight years in leading a rapid MVP startup/project/team, hyper-focused on
coding  mvp  github 
april 2016
Organizing Large React Applications – Kapost Engineering
As you may have picked up from previous posts, we have embraced React here at Kapost. Our development teams have grown the React codebase quite a bit over that past six months. React, of course, does not dictate any folder structure but we have felt an increasing need to organize new and existing apps as we grow and share more code.

Why does application organization matter when we have editors with project search and IDE “go to definition” commands? From a human perspective, it’s easy to get lost in hundreds of files. Clear and effective organization helps us focus on just one aspect of the complex system. It can be easier to onboard new developers who can learn parts of the app in isolation. From a machine perspective, it’s simpler to manage dependencies and to optimize code with build tools like webpack. In short, it provides the usual benefits of good abstraction—comprehensibility and composability.
react  architecture  javascript 
april 2016
Atom package: git-history
Git History Package for Atom
View previous versions of any file known to git. By default, the plugin will now show a diff with the selected version. This can be disabled in the settings.
git  utilities  plugins  atom  coding  tools 
april 2016
Minecraft: more than just a game
Clive Thompson's article for the NY Times about Minecraft captures what many players, parents, and teachers find exciting about the game that seems like more than just a game.

Presto: Jordan had used the cow's weird behavior to create, in effect, a random-number generator inside Minecraft. It was an ingenious bit of problem-solving, something most computer engineers I know would regard as a great hack -- a way of coaxing a computer system to do something new and clever.
kids  games  technology  minecraft 
april 2016
Flux For Stupid People
As a stupid person, this is what I wish someone had told me when I struggled learning Flux. It's not straightforward, not well documented, and has many moving parts.
flux  Development  javascript  programming  react  reactjs 
april 2016
Bug 153852 – <body> with overflow:hidden CSS is scrollable on iOS
Testcase demonstrating the problem

Applying `overflow: hidden` to the `<body>` should make it non-scrollable.
This works correctly on OS X Safari, but doesn't work correctly on iOS Safari.

Original Bootstrap issue:
Lost to the sands of time, but is relevant & popular.
See also

Steps to reproduce:
1. Open the attached testcase in iOS Safari.
2. Tap the "Launch demo modal" button.
3. A yellow box with text appears.
4. Scroll the yellow box to its bottom, where there are "Close" and "Save changes" buttons, and lift your finger off the screen to ensure that the scroll gesture ends.
5. Attempt to scroll the yellow box further downward (which is to say, apply a "fling upward" gesture to the yellow box).

Actual result:
The <body> underneath the yellow box scrolls downward.

Expected result:
The <body> should not scroll (just like on OS X Safari).
Comment 1
bug  css  scrolling  iOS  safari 
april 2016
Webpack 2 Tree Shaking Configuration
Tree Shaking, a modern dead code elimination algorithm for ECMAScript 2015+ is one of the most anticipated features in the upcoming Webpack 2. By eliminating unused ES6 exports, Webpack can further help the minification process to get your bundle much smaller than ever before.
webdev  coding  webpack  ES2015  babel  tools  react 
april 2016
Simple React/Redux Testing
Testing React components is made really easy with Reacts Test Utilities. There are many article on how to test your web application but not so many on what to test or how to structure of those tests.
This article will focus on how I test my Flux Architected React web applications (built with Redux). I don’t profess to document the prescribed way of testing, just what works for me.
testing  javascript  react  coding  redux 
april 2016
React Js - how to keep bundle.min.js small? - Stack Overflow
I was able to achieve pretty good results with Webpack. I wrote about this in Optimizing Webpack Prod Build for React + ES6 Apps Here's my Webpack config: var webpack = require('webpack'); var path =
april 2016
Rules For Structuring (Redux) Applications — Jack Hsu
As our applications grow, we often find that file structure and organization to be crucial for the mainability of application code. What I want to do in this post is to present three organizational
javascript  redux  coding  tips 
march 2016
The viability of JS frameworks on mobile
Whether I like it or not, not everyone using my web apps will be running iOS 9 on an iPhone 6S or a Nexus 6P and connecting via super-speedy wifi.

The reality is often anything but that. 3G connections and older hardware is often the norm. Google reports that there are 1.4 billion active Android users. Many of them, will no doubt, be running less-than-top-of-the-line hardware.

And, if you read stuff like Jeff Atwood’s recent post on Android performance you may feel that things are pretty bleak for the mobile web.
javascript  mobile  coding 
march 2016
« earlier      
advice aircraft alcohol alexis-madrigal algorithms america analytics android angularjs animals animation api app apple applications apps art astronomy audio awesome baseball beer beverages blog blogs books business california camera career cellphones charts climate clothing code coding coffee community communitymanagement computer computers cool crazy css css3 culture data database design dev development diy dodgers dogs drinks earth earthquakes economics editor elections email exercise facebook feedly fitness food for framework free fun funny gadgets gallery game games gaming generator geology github google google-reader government graphics hacks hardware health history home home-improvement housing howto html html5 humor ifttt image images infographics interesting internet interview interviews ios ipad iphone japan javascript journalism jquery js language later learning libraries library life lifehacker linux lists longreads losangeles mac mapping maps marketing media military mobile movies music nasa nature neat neighborhoods news node.js nodejs oakland oceans opensource osx outdoors pets photo photography photos photoshop php plugin plugins pocket politics privacy productivity programming react reactjs read reader reading recently recipes redux reference research sanfrancisco saved saved-links science search security shopping soccer social social-media socialmedia socialnetwork software space space-shuttle sports starred-item startup statistics streaming tech technology television testing timelapse tips to-blog to-buy tools training transit transportation travel tutorial tutorials twitter ui utilities video videos visualization water weather web webapp webdesign webdev weird windows wishlist wordpress work writing youtube

Copy this bookmark: