humaan
/ webpack-demo-07-HelloText.js
Created
September 2, 2015 01:56
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Import React | |
| import React from 'react'; | |
| // Create class called HelloText that extends the base React Component class | |
| export default class HelloText extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| } | |
| render() { |
humaan
/ webpack-demo-06-HelloBox.js
Created
September 2, 2015 01:55
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Import React and HelloText class | |
| import React from 'react'; | |
| import HelloText from './HelloText'; | |
| // Create class called HelloBox that extends the base React Component class | |
| export default class HelloBox extends React.Component { | |
| constructor() { | |
| super(); | |
| } |
humaan
/ webpack-demo-04-entry.js
Created
September 2, 2015 01:53
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Import CSS | |
| import '../css/master.scss'; | |
| // Import React and JS | |
| import HelloBox from './HelloBox'; | |
| import React from 'react'; | |
| // Render! | |
| React.render(<HelloBox />, document.getElementsByTagName('body')[0]); |
humaan
/ webpack-demo-05-master.scss
Last active
September 2, 2015 01:55
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html { | |
| body { | |
| font-size: 100%; | |
| background: url(../img/repeater.jpg); | |
| } | |
| } |
humaan
/ webpack-demo-03-webpack.config.js
Created
September 2, 2015 00:40
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module.exports = { | |
| entry: getEntrySources(['./src/js/entry.js']), | |
| output: { | |
| publicPath: 'http://localhost:8080/', | |
| filename: 'build/bundle.js' | |
| }, | |
| devtool: 'eval', | |
| module: { | |
| preLoaders: [ | |
| { |
humaan
/ webpack-demo-02-index.html
Created
September 2, 2015 00:36
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>React Demo</title> | |
| </head> | |
| <body> | |
| <script src="http://localhost:8080/build/bundle.js" charset="utf-8"></script> | |
| </body> | |
| </html> |
humaan
/ webpack-demo-01-package.json
Last active
January 18, 2016 01:45
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "humaan-demo-webpack-react-app", | |
| "version": "1.0.0", | |
| "description": "A basic environment for writing React apps in ES6 and built using webpack", | |
| "private": true, | |
| "scripts": { | |
| "test": "echo \"Error: no test specified\" && exit 1", | |
| "webpack-server": "webpack-dev-server --hot --progress --colors", | |
| "web-server": "http-server -p 3000 .", | |
| "start": "npm run webpack-server & npm run web-server" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Create the additional mask shapes and apply to the group | |
| parts.tent_mask = paper.path( paths.small_tent ).attr({ | |
| fill : '#fff' | |
| }); | |
| logo_group.attr({ | |
| mask : parts.tent_mask | |
| }); | |
| //Hover animations | |
| $('#logo').hover(function(){ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Minor Detailing | |
| parts.cover = paper.circle(20.5, 20.5, 3).attr({ | |
| fill : '#000', | |
| opacity : 1 | |
| }); | |
| //Hover animations | |
| $('#logo').hover(function(){ | |
| ... |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //SVG Paths | |
| var paths = { | |
| ... | |
| //Additional paths for the masks | |
| big_tent : 'M 17.3,27.6 23.7,27.6 20.5,22 zM0,0v41h41V0H0z M29.5,29h-18v-1.5h1.2l7.2-12.5l-1.5-2.6l0.9-0.5l1.2,2.1l1.2-2.1l0.9,0.5l-1.5,2.6l7.2,12.5h1.2V29z', | |
| small_tent : 'M 20.1,21.3 20.9,21.3 20.5,20.7 zM0,0v41h41V0H0z M21.5,21.4h-2v-0.2h0.1l0.8-1.4l-0.2-0.3l0.1-0.1l0.1,0.2l0.1-0.2l0.1,0.1l-0.2,0.3l0.8,1.4h0.1V21.4z' | |
| }; |
NewerOlder