Rohit Kumar 2rohityadav

Storing Images and Demos in your Repo

In this quick walkthough you'll learn how to create a separate branch in your repo to house your screenshots and demo gifs for use in your master's readme.

How to

1. Clone a fresh copy of your repo

In order to prevent any loss of work it is best to clone the repo in a separate location to complete this task.

2. Create a new branch

Create a new branch in your repo by using git checkout --orphan assets

Install provider-* for Neovim (nvim) in Windows

:h provider-python

First, add those lines in your %LocalAppData%\nvim\init.vim:

" Source local init.vim {{{1
let s:local_vimrc = expand('$LOCALAPPDATA\nvim\init.local.vim')
if filereadable(fnameescape(s:local_vimrc))

INSERT GRAPHIC HERE (include hyperlink in image)

Repository Title Goes Here

Subtitle or Short Description Goes Here

Frontend Masters: Electron (Version 2)

You'll need a recent version of Node.js installed on your computer with administrative access. Yarn is not required, but Electron Forge uses it, so it would be helpful to install beforehand.

Please make sure you're using a supported platform. This is particularly important if you're running Linux.

Important note: If you're using Windows, make sure you're not using the Windows Subsystem for Linux. This will confuse Electron to thinking you're running on a Linux machine when you're really not.

We'll be using working through the following repositories over the course of the workshop:

Participants should have a recent version of Node.js installed on their system (preferably the latest LTS version, which is 6.9.1 as of this writing—but anything from 0.10 on should work). Participants should clone the following repositories and run npm install in each of them prior to the start of the workshop.

Optional: It might be helpful to install Electron globally so that you can use it from the command line in case there are any issues with any of the dependencies in the project above. You can install this through npm install -g electron.

Finally, debugging the main process is easiest using Visual Studio Code, which is available for all platforms (Windows, Linux, and macOS). This is not a hard requirement, but helpful if you'd like to follow along for that small segment of the workshop.

How to export your VS Code extensions from terminal

Note: Unix-like systems only.

Export your extensions to a shell file:

code --list-extensions | sed -e 's/^/code --install-extension /' > my_vscode_extensions.sh

Tabs and Windows

Function	Shortcut
New Tab	`⌘` + `T`
Close Tab or Window	`⌘` + `W` (same as many mac apps)
Go to Tab	`⌘` + `Number Key` (ie: `⌘2` is 2nd tab)
Go to Split Pane by Direction	`⌘` + `Option` + `Arrow Key`
Cycle iTerm Windows	`⌘` + `backtick` (true of all mac apps and works with desktops/mission control)

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Shallow vs Deep Copy</title>
	<meta name="viewport" content="width=device-width">
	<link rel="stylesheet" href="../video-pages/main.css">
	</head>
	<body>
	<header>

	/*
	* The default style sheet used to render HTML.
	*
	* Copyright (C) 2000 Lars Knoll ([email protected])
	* Copyright (C) 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011 Apple Inc. All rights reserved.
	*
	* This library is free software; you can redistribute it and/or
	* modify it under the terms of the GNU Library General Public
	* License as published by the Free Software Foundation; either
	* version 2 of the License, or (at your option) any later version.

	/*
	Based on:
	1. http://stephen.io/mediaqueries
	2. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
	*/

	/* iPhone X in portrait & landscape */
	@media only screen
	and (min-device-width : 375px)
	and (max-device-width : 812px)