Hatem tomavic

Whether you're trying to give back to the open source community or collaborating on your own projects, knowing how to properly fork and generate pull requests is essential. Unfortunately, it's quite easy to make mistakes or not know what you should do when you're initially learning the process. I know that I certainly had considerable initial trouble with it, and I found a lot of the information on GitHub and around the internet to be rather piecemeal and incomplete - part of the process described here, another there, common hangups in a different place, and so on.

In an attempt to coallate this information for myself and others, this short tutorial is what I've found to be fairly standard procedure for creating a fork, doing your work, issuing a pull request, and merging that pull request back into the original project.

Creating a Fork

Just head over to the GitHub page and click the "Fork" button. It's just that simple. Once you've done that, you can use your favorite git client to clone your repo or j

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

VSCode Shortcuts

List of helpful shortcuts for faster coding

If you have any other helpful shortcuts, feel free to add in the comments of this gist :)

Official List of all commands

Windows
Mac

	import { Component, OnInit, OnDestroy } from '@angular/core';
	import {Http} from "@angular/http";
	import { LocalCacheService } from "./local-cache.service";

	@Component({
	selector: 'app-example',
	templateUrl: './app.component.html',
	styleUrls: ['./app.component.scss']
	})
	export class ExampleComponent implements OnInit, OnDestroy {

	import * as React from "react";
	import * as PropTypes from "prop-types";

	interface IExampleComponentProps {
	text?: string;
	onCounterIncrease: (count: number) => void;
	}

	interface IExampleComponentState {
	clicks: number;

	/**
	* Take an array of objects of similar structure and convert it to a CSV.
	* @source https://halistechnology.com/2015/05/28/use-javascript-to-export-your-data-as-csv/
	* @modifiedBy sators
	* @param {Array} options.data Array of data
	* @param {String} options.columnDelimiter Column separator, defaults to ","
	* @param {String} options.lineDelimiter Line break, defaults to "\n"
	* @return {String} CSV
	*/
	export default ({data = null, columnDelimiter = ",", lineDelimiter = "\n"}) => {

	SPACESHIP_ANGULAR_SHOW="${SPACESHIP_ANGULAR_SHOW:=true}"
	SPACESHIP_ANGULAR_PREFIX="${SPACESHIP_ANGULAR_PREFIX:="and "}"
	SPACESHIP_ANGULAR_SUFFIX="${SPACESHIP_ANGULAR_SUFFIX:="$SPACESHIP_PROMPT_DEFAULT_SUFFIX"}"
	SPACESHIP_ANGULAR_SYMBOL="${SPACESHIP_ANGULAR_SYMBOL:="🅰️ "}"
	SPACESHIP_ANGULAR_DEFAULT_VERSION="${SPACESHIP_ANGULAR_DEFAULT_VERSION:=""}"
	SPACESHIP_ANGULAR_COLOR="${SPACESHIP_ANGULAR_COLOR:="red"}"

	_is_angular_project() {
	node -p "r=require('./package.json'); r.devDependencies['$1'] \|\| r.dependencies['$1']" 2>/dev/null
	}

	...
	"architect": {
	"build": {
	"builder": "@angular-builders/custom-webpack:browser",
	"options": {
	"customWebpackConfig": {
	"path": "./extend.webpack.config.js"
	},
	...

	<ion-input type="tel" pattern="\d" placeholder="(xxx) xxx-xxxx" mask="() -***" [(ngModel)]="phone" name="phone"></ion-input>

	<ion-input type="tel" pattern="\d" placeholder="xxx-xx-xxxx" mask="--****" [(ngModel)]="ssn" name="ssn"></ion-input>

	/* Add the subtle gradient to the editor background */
	.monaco-editor {
	background-color: transparent !important;
	background-image: linear-gradient(to bottom, #2a2139 75%, #34294f);
	background-size: auto 100vh;
	background-position: top;
	background-repeat: no-repeat;
	}

	.monaco-workbench {