Pavlo Michal pavloconuve

Open source beginner bugs

This is a list of JavaScript projects on Github that label issues as easy or beginner-friendly.

beginner

Idiomatic React Testing Patterns

Testing React components seems simple at first. Then you need to test something that isn't a pure interaction and things seem to break down. These 4 patterns should help you write readable, flexible tests for the type of component you are testing.

Setup

I recommend doing all setup in the most functional way possible. If you can avoid it, don't set variables in a beforeEach. This will help ensure tests are isolated and make things a bit easier to reason about. I use a pattern that gives great defaults for each test example but allows every example to override props when needed:

Recently CSS has got a lot of negativity. But I would like to defend it and show, that with good naming convention CSS works pretty well.

My 3 developers team has just developed React.js application with 7668 lines of CSS (and just 2 !important). During one year of development we had 0 issues with CSS. No refactoring typos, no style leaks, no performance problems, possibly, it is the most stable part of our application.

Here are main principles we use to write CSS for modern (IE11+) browsers:

SUIT CSS naming conventions + SUIT CSS design principles;
PostCSS + CSSNext. Future CSS syntax like variables, nesting, and autoprefixer are good enough;
Flexbox is awesome. No need for grid framework;
Normalize.css, base styles and variables are solid foundation for all components;

	#!/usr/bin/env bash
	# MIT © Sindre Sorhus - sindresorhus.com

	# git hook to run a command after `git pull` if a specified file was changed
	# Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.

	changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"

	check_run() {
	echo "$changed_files" \| grep --quiet "$1" && eval "$2"

	# Compiled source #
	###################
	*.com
	*.class
	*.dll
	*.exe
	*.o
	*.so

	# Packages #

	Guides:

	http://pragtob.wordpress.com/2014/01/13/how-to-get-started-with-contributing-to-open-source/
	http://movethewebforward.org/
	http://www.smashingmagazine.com/2011/11/30/the-smashing-guide-to-moving-the-web-forward-community/
	http://nshipster.com/stewardship/
	https://speakerdeck.com/brycekahle/helping-open-source-software

	for Designers:

	/**
	* Angular $rootScope.Scope.$once
	* Copyright (c) 2014 marlun78
	* MIT License, https://gist.github.com/marlun78/bd0800cf5e8053ba9f83
	*/
	$provide.decorator('$rootScope', function ($delegate) {
	var Scope = $delegate.__proto__.constructor;
	Scope.prototype.$once = function (name, listener) {
	var deregister = this.$on(name, function () {
	deregister();

	"use strict";

	/**
	* Hypertext Transfer Protocol (HTTP) response status codes.
	* @see {@link https://en.wikipedia.org/wiki/List_of_HTTP_status_codes}
	*/
	enum HttpStatusCode {

	/**
	* The server has received the request headers and the client should proceed to send the request body