An example client that communicates with backend.
Attention! This project is in active development. Please don't use it in production until the 1.0.0 release.
$ git clone https://github.com/the-ring/frontend.git
$ cd frontend
$ npm install
Default config:
{
styles: { // inherited from the-ring/main-styles
icons: {
logoIcon: `${assets}/logo.svg`,
homeIcon: `${svg}/home.svg`,
reportIcon: `${svg}/archive.svg`,
chartIcon: `${svg}/line-graph.svg`,
cycleIcon: `${svg}/cycle.svg`,
settingsIcon: `${svg}/cog.svg`,
chevronDownIcon: `${svg}/chevron-small-down.svg`,
circlePlusIcon: `${svg}/circle-with-plus.svg`,
pinIcon: `${svg}/pin.svg`,
linkIcon: `${svg}/link.svg`,
crossIcon: `${svg}/cross.svg`,
userIcon: `${svg}/user.svg`,
lockIcon: `${svg}/lock.svg`,
mailIcon: `${svg}/mail.svg`
},
fonts: {
fontFamily: '"Roboto"'
},
colors: {
firstColor: '#121231',
secondColor: '#212141',
thirdColor: '#3e3c5f',
fontColor: '#fff',
googleColor: '#44b759',
yandexColor: '#fc0',
confirmColor: '#44b759',
cancelColor: '#ab0149',
disabledColor: '#787878'
},
other: {
cardSmWidth: '400px',
cardSmMinWidth: '400px',
cardMdWidth: '900px',
cardMdMinWidth: '650px',
cardLgWidth: '1350px',
cardLgMinWidth: '850px',
cardXlWidth: '1800px',
cardXlMinWidth: '1100px'
}
},
react: { // inherited from the-ring/main-react-components
cache: {
period: 3e5 // 5 min
},
backend: {
url: 'http://localhost:3000',
connectUrl: '/connect'
},
frontend: {
port: 3001,
url: 'http://localhost:3001',
connectUrl: 'http://localhost:3001/connect'
}
}
}
$ npm run build
$ npm run build:css
$ npm run dev
$ npm run watch
$ npm start
The MIT License (MIT)
Copyright (c) 2016 Alexey Bystrov