Mike Boutin DWboutin

🎯

Focusing

Fullstack Javascript developer, React, React-Native, NodeJS, HTML5 games enthousiast, bearded man.

DWboutin / jquery-ui-slider-extension.css

Last active September 1, 2017 14:05

jQuery UI slider labels with pips

DWboutin / gulpfile.js

Last active November 17, 2015 20:59

Todo list React tutorial

	var gulp = require('gulp');
	var source = require('vinyl-source-stream');
	var browserify = require('browserify');
	var sourcemaps = require('gulp-sourcemaps');
	var uglify = require('gulp-uglify');
	var buffer = require('vinyl-buffer');
	var babelify = require('babelify');

	gulp.task('build', function () {
	return browserify({entries: './src/client/app.js', extensions: ['.js'], debug: true})

DWboutin / app.js

Created November 9, 2015 20:31

Todo liste React tutorial finished

	import React from 'react';
	import ReactDOM from 'react-dom';

	class Application extends React.Component {
	constructor(props) {
	super(props);
	this.state = {
	itemList: [{name: 'Apple', type: 'Fruit'}, {name: 'Beef', type: 'Meat'}]
	}
	}

DWboutin / Application.react.js

Last active March 10, 2016 20:53

Todo list React Redux

	import React from 'react';

	import GroceryList from './GroceryList.react';
	import ItemAdder from './ItemAdder.react';

	class Application extends React.Component {
	constructor(props) {
	super(props);
	this.state = {
	itemList: [{name: 'Apple', type: 'Fruit'}, {name: 'Beef', type: 'Meat'}]

DWboutin / index.html

Last active November 23, 2015 21:39

Chosen for the React Tutorial

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>React Tutorial</title>
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css">
	</head>
	<body>
	<div id="react-app"></div>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

DWboutin / filetraversing.js

Created November 27, 2015 21:05

Traverse filesystem nodejs

	var fs = require('fs');
	var traverseFileSystem = function (currentPath) {
	var files = fs.readdirSync(currentPath);
	for (var i in files) {
	var currentFile = currentPath + '/' + files[i];
	var stats = fs.statSync(currentFile);
	if (stats.isFile()) {
	var path = currentFile.split('/');
	var newName = path.pop().replace(/-/g, '_');

DWboutin / wrapper.react.js

Created December 11, 2015 15:17

React ES6 composition

	import React from 'react';

	export default function Wrapper () {
	return WrappedComponent => class extends React.Component {
	constructor(props) {
	super(props);
	this.state = { data: null }; //exemple
	}
	componentDidMount() {
	this.setState({ data: 'Hello' }); //exemple

DWboutin / Application.react.js

Last active March 11, 2016 15:28

Modification d'item de la liste

	/** @packages importation */
	import React from 'react';
	import { connect } from 'react-redux';

	/** actions importation */
	import { changeListArray, itemSubmit, itemIncreasing, itemNameChange } from '../actions/grocery-list-actions';

	/** Item de base pour le store */
	import baseItemsList from '../utils/baseList';

DWboutin / Application.react.js

Created March 11, 2016 16:28

Tutoriel React après -> shouldComponentUpdate

	import React from 'react';
	import { connect } from 'react-redux';

	import GroceryList from './GroceryList.react';
	import ItemAdder from './ItemAdder.react';

	import { changeListArray, itemSubmit, itemIncreasing, itemNameChange } from '../actions/grocery-list-actions';
	import baseItemsList from '../utils/baseList';

	class Application extends React.Component {

DWboutin / Application.react.js

Created March 11, 2016 21:21

Tutoriel React React-router

	import React from 'react';
	import { Link } from 'react-router';

	class Application extends React.Component {
	constructor(props) {
	super(props);
	}

	render() {
	return (