Tom Beddard subblue

Women Who Code Meetup 26 June 2018

Links from the talks at the KPV LAB Edinburgh office

Building Static Websites with Next.js & CSS Grid

Demo site see the contact page for links.

An Intro to React Native

The Wonders of WebGL

Development Resources

This is intended to be a growing library of useful links for documentation and articles specific to the different technologies and libraries we use for our projects.

To keep ahead of the curve it is a good idea to use the Google Chrome dev channel version of the browser where many of the ES6 features can be used within the dev console without transpiling via Babel.
Chrome Canary build can also be used, but it tends to break things rather too often!

Javascript ES6

Learn ES2015 - Babel's detailed overview which was developed from the ES6 features guide.
Essential JS links - the list to end all lists! Curated by Eric Elliot who also has many very g

	in vec2 v_texcoord; // texture coords
	in vec3 v_normal; // normal
	in vec3 v_binormal; // binormal (for TBN basis calc)
	in vec3 v_pos; // pixel view space position

	out vec4 color;

	layout(std140) uniform Transforms
	{
	mat4x4 world_matrix; // object's world position

	{
	"root": true,
	"parser": "babel-eslint",
	"plugins": ["react"],
	"extends": ["eslint:recommended", "plugin:react/recommended"],
	"env": {
	"browser": true,
	"node": true,
	"es6": true,
	"jasmine": true,

	'use strict';
	/* eslint "react/prop-types": 0 */
	// import Immutable from 'immutable';
	import React, { PropTypes, Component } from 'react';
	import { Editor, EditorState, ContentState, RichUtils, convertFromHTML, convertFromRaw } from 'draft-js';
	import { stateToHTML } from 'draft-js-export-html';


	// based on this example:
	// https://github.com/facebook/draft-js/tree/master/examples/rich

	{
	"name": "test-app",
	"version": "0.0.1",
	"description": "Test App",
	"main": "index.js",
	"scripts": {
	"start": "clear && NODE_ENV=development webpack-dev-server --config webpack-dev.js --devtool cheap-module-source-map --inline --hot",
	"test": "clear && watch 'npm run --silent mocha' ./src -d -u",
	"mocha": "clear && mocha --opts mocha.opts ./src/*/-test.js",
	},

	'use strict';
	const webpack = require('webpack');
	const HtmlWebpackPlugin = require('html-webpack-plugin');
	const npmPackage = require('./package.json');
	const host = '0.0.0.0';
	const port = 3000;

	const config = {
	entry: [
	'babel-polyfill',

	perf = window.performance \|\| Date

	class Resizer


	constructor: (srcImg, @options = {}) ->
	if typeof srcImg == 'string'
	@loadImage(srcImg)

	if srcImg.toString().indexOf('Blob') > -1

	# node modules
	fs = require 'fs'
	path = require 'path'
	url = require 'url'
	browserSync = require 'browser-sync'
	browserify = require 'browserify'
	watchify = require 'watchify'
	source = require 'vinyl-source-stream'
	del = require 'del'