Skip to content

Commit d6e462c

Browse files
author
Giacomo Rebonato
committed
first commit
0 parents  commit d6e462c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+1478
-0
lines changed

‎.babelrc

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"presets": ["react"],
3+
"plugins": ["transform-react-router-optimize"],
4+
"env": {
5+
"production": {
6+
"presets": ["es2015"]
7+
}
8+
}
9+
}

‎.firebaserc

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"projects": {
3+
"default": "mino-material"
4+
}
5+
}

‎.gitignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
firebase-debug.log
2+
node_modules
3+
typings
4+
npm-debug.log
5+
public/assets

‎.vscode/settings.json

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// Place your settings in this file to overwrite default and user settings.
2+
{
3+
"editor.fontFamily": "Fira Code",
4+
"editor.fontSize": 12,
5+
"editor.fontLigatures": true
6+
}

‎LICENSE

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
2+
The MIT License (MIT)
3+
4+
Copyright (c) 2016 Giacomo Rebonato
5+
6+
Permission is hereby granted, free of charge, to any person obtaining a copy
7+
of this software and associated documentation files (the "Software"), to deal
8+
in the Software without restriction, including without limitation the rights
9+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10+
copies of the Software, and to permit persons to whom the Software is
11+
furnished to do so, subject to the following conditions:
12+
13+
The above copyright notice and this permission notice shall be included in all
14+
copies or substantial portions of the Software.
15+
16+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22+
SOFTWARE.

‎README.md

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# Mino Material
2+
This is an opinionated Boilerplate with the following tecnologies:
3+
- ReactJS
4+
- Mobx
5+
- Firebase (for hosting too)
6+
- Material design
7+
- Typescript
8+
9+
### Demo
10+
[mino-material.firebaseapp.com](https://mino-material.firebaseapp.com/)
11+
12+
### Commands
13+
```npm install```
14+
Will install the dependencies and Typescript typings
15+
16+
```npm run dev```
17+
Will compile the project and start the development server on localhost:3000
18+
19+
```npm run build```
20+
Will create the production bundle, overriding the development one. Run this command before to deploy.
21+
22+
### Firebase CLI
23+
The project has been created using the Firebase CLI. You can use it to deploy to your Firebase instance.
24+
Change your project name ```.firebaserc``` file.
25+
26+
### Material design
27+
I have used React-Toolbox for Material Design components.
28+
If you want to keep the bundle as small as possible, pay attention how to write your import.
29+
30+
### Tests
31+
In progress
32+
33+
### To do
34+
- Extract CSS in a separate Chunk
35+
- Progressive app configuration
36+
- Video examples

‎database.rules.json

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"rules": {
3+
".read": "auth != null",
4+
".write": "auth != null"
5+
}
6+
}

‎firebase.json

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"database": {
3+
"rules": "database.rules.json"
4+
},
5+
"hosting": {
6+
"public": "public",
7+
"rewrites": [
8+
{
9+
"source": "**",
10+
"destination": "/index.html"
11+
}
12+
]
13+
}
14+
}

‎package.json

+63
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
{
2+
"name": "mino_material",
3+
"version": "1.0.0",
4+
"description": "Material Design Boilerplate",
5+
"main": "index.js",
6+
"scripts": {
7+
"build": "NODE_ENV=production $(npm bin)/webpack",
8+
"clean": "$(npm bin)/rimraf ./public/assets",
9+
"dev": "DEV_SERVER=1 $(npm bin)/webpack-dev-server --quiet --hot --inline --content-base public --port 3000 --history-api-fallback",
10+
"prod": "DEV_SERVER=1 NODE_ENV=production $(npm bin)/webpack-dev-server --quiet --hot --inline --content-base public --port 3000 --history-api-fallback",
11+
"start": "$(npm bin)/webpack-dev-server",
12+
"postinstall": "$(npm bin)/typings install",
13+
"test": "NODE_ENV=test $(npm bin)/mocha -r jsdom-global/register --compilers ts:ts-node/register --compilers tsx:ts-node/register --require ignore-styles ./src/**/__tests__/**.spec.ts*"
14+
},
15+
"author": "Giacomo Rebonato",
16+
"license": "MIT",
17+
"devDependencies": {
18+
"awesome-typescript-loader": "^2.1.1",
19+
"babel-core": "^6.13.2",
20+
"babel-loader": "^6.2.5",
21+
"babel-plugin-transform-react-router-optimize": "^1.0.1",
22+
"babel-preset-es2015": "^6.13.2",
23+
"babel-preset-react": "^6.11.1",
24+
"chai": "^3.5.0",
25+
"chai-enzyme": "^0.5.0",
26+
"copy-webpack-plugin": "^3.0.1",
27+
"css-loader": "^0.23.1",
28+
"enzyme": "^2.4.1",
29+
"extract-text-webpack-plugin": "^2.0.0-beta.3",
30+
"firebase": "^3.2.1",
31+
"ignore-styles": "^4.0.0",
32+
"jsdom": "^9.4.2",
33+
"jsdom-global": "^2.0.0",
34+
"mobx": "^2.4.3",
35+
"mobx-react": "^3.5.5",
36+
"mobx-react-devtools": "^4.2.4",
37+
"mocha": "^3.0.2",
38+
"node-sass": "^3.8.0",
39+
"normalize.css": "^4.2.0",
40+
"react": "^15.3.1",
41+
"react-addons-css-transition-group": "^15.3.1",
42+
"react-addons-test-utils": "^15.3.0",
43+
"react-addons-update": "^15.3.1",
44+
"react-cropper": "^0.9.4",
45+
"react-dom": "^15.3.1",
46+
"react-dropzone": "^3.5.3",
47+
"react-flex": "^2.2.7",
48+
"react-router": "^2.7.0",
49+
"react-toolbox": "^1.1.2",
50+
"rimraf": "^2.5.4",
51+
"sass-loader": "^4.0.0",
52+
"sinon": "^1.17.5",
53+
"style-loader": "^0.13.1",
54+
"ts-node": "^1.3.0",
55+
"tslint": "^3.14.0",
56+
"typescript": "^2.1.0-dev.20160812",
57+
"typings": "^1.3.2",
58+
"webpack": "^2.1.0-beta.20",
59+
"webpack-dashboard": "^0.1.6",
60+
"webpack-dev-server": "^2.1.0-beta.0"
61+
},
62+
"dependencies": {}
63+
}

‎public/index.html

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<html>
2+
<head>
3+
<title>Mino Material</title>
4+
<meta charset="utf-8">
5+
<meta name="description" content="SPA Material Design and Firebase">
6+
<meta name="author" content="Giacomo Rebonato">
7+
<meta name="viewport" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width">
8+
<meta name="viewport" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)">
9+
<meta name="apple-mobile-web-app-title" content="Material Console">
10+
<meta name="apple-mobile-web-app-capable" content="yes">
11+
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
12+
<meta name="format-detection" content="telephone=no">
13+
<meta name="HandheldFriendly" content="True">
14+
<meta http-equiv="cleartype" content="on">
15+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
16+
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
17+
<link href="assets/styles.css" rel="stylesheet">
18+
<link rel="manifest" href="/manifest.json">
19+
</head>
20+
<body>
21+
<div id="app"></div>
22+
<script defer src="assets/vendor.js"></script>
23+
<script defer src="assets/bundle.js"></script>
24+
</body>
25+
</html>

‎public/manifest.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "Mino Material",
3+
"short_name": "MinoMaterial",
4+
"start_url": "mino-material.firebaseapp.com",
5+
"display": "fullscreen",
6+
"background_color": "#fff",
7+
"description": "Material and Firebase boilerplate.",
8+
"icons": [{
9+
"src": "images/touch/homescreen48.png",
10+
"sizes": "48x48",
11+
"type": "image/png"
12+
}, {
13+
"src": "images/touch/homescreen72.png",
14+
"sizes": "72x72",
15+
"type": "image/png"
16+
}, {
17+
"src": "images/touch/homescreen96.png",
18+
"sizes": "96x96",
19+
"type": "image/png"
20+
}, {
21+
"src": "images/touch/homescreen144.png",
22+
"sizes": "144x144",
23+
"type": "image/png"
24+
}, {
25+
"src": "images/touch/homescreen168.png",
26+
"sizes": "168x168",
27+
"type": "image/png"
28+
}, {
29+
"src": "images/touch/homescreen192.png",
30+
"sizes": "192x192",
31+
"type": "image/png"
32+
}],
33+
"related_applications": [{
34+
"platform": "web"
35+
}]
36+
}

‎src/app.tsx

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import './styles/global.scss'
2+
import React = require('react')
3+
import { render } from 'react-dom'
4+
import { browserHistory, Router } from 'react-router'
5+
import routes from './routes'
6+
7+
if ('serviceWorker' in navigator) {
8+
navigator.serviceWorker.register('/assets/sw.js', { scope: '/assets/' })
9+
.then((registration) => {
10+
console.log('Service Worker Registered')
11+
})
12+
13+
navigator.serviceWorker.ready.then((registration) => {
14+
console.log('Service Worker Ready')
15+
})
16+
}
17+
18+
19+
render(
20+
<Router routes={routes} history={browserHistory} />,
21+
document.getElementById('app')
22+
)

‎src/components/DrawerLink.tsx

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import * as React from 'react'
2+
import { Link } from 'react-toolbox/lib/link'
3+
import { browserHistory } from 'react-router'
4+
import {IconMenu, Menu, MenuItem, MenuDivider } from 'react-toolbox/lib/menu'
5+
6+
function DrawerLink (props: IDrawerLinkProps) {
7+
return (
8+
<MenuItem
9+
selected={window.location.pathname === props.to}
10+
icon={props.icon}
11+
onClick={() => {
12+
browserHistory.push(props.to)
13+
}}
14+
caption={props.label}
15+
/>
16+
)
17+
}
18+
19+
interface IDrawerLinkProps {
20+
label: string
21+
to: string
22+
icon?: string
23+
}
24+
25+
export default DrawerLink

‎src/components/LoginForm.tsx

+73
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import * as React from 'react'
2+
import {
3+
Card, CardMedia, CardTitle, CardText, CardActions
4+
} from 'react-toolbox/lib/card'
5+
import Input from 'react-toolbox/lib/input'
6+
import { Button, IconButton } from 'react-toolbox/lib/button'
7+
import { observer } from 'mobx-react'
8+
import stores from '../stores'
9+
10+
function LoginForm (props: ILoginFormProps) {
11+
if (props.is_logged_in) { return null }
12+
13+
return (
14+
<Card style={props.style}>
15+
<CardTitle>Login</CardTitle>
16+
<form onSubmit={props.handle_submit}>
17+
<CardText>
18+
<Input
19+
type='email'
20+
label='Email'
21+
onChange={props.handle_email_change}
22+
/>
23+
<Input
24+
type='password'
25+
label='Password'
26+
onChange={props.handle_password_change}
27+
/>
28+
</CardText>
29+
<CardActions style={{flexDirection: 'row-reverse'}}>
30+
<Button primary raised ripple label='Submit' />
31+
</CardActions>
32+
</form>
33+
</Card>
34+
)
35+
}
36+
37+
interface ILoginFormProps {
38+
login_email: string
39+
login_password: string
40+
handle_email_change (email: string): void
41+
handle_password_change (password: string): void
42+
handle_submit (e: React.FormEvent): void
43+
is_logged_in: boolean
44+
style?: Object
45+
}
46+
47+
function binding (Component: React.StatelessComponent<ILoginFormProps>) {
48+
const { auth_store } = stores
49+
const binded = function (props) {
50+
return (
51+
<Component
52+
login_email={auth_store.login_email}
53+
login_password={auth_store.login_password}
54+
handle_email_change={(email) => {
55+
auth_store.set_login_email(email)
56+
}}
57+
handle_password_change={(password) => {
58+
auth_store.set_login_password(password)
59+
}}
60+
handle_submit={(e) => {
61+
e.preventDefault()
62+
auth_store.login_submit()
63+
}}
64+
is_logged_in={auth_store.is_logged_in}
65+
{...props}
66+
/>
67+
)
68+
}
69+
70+
return observer(binded)
71+
}
72+
73+
export default binding(LoginForm)

0 commit comments

Comments
 (0)