Web app that helps bikers to find nearest secure motorcycle parking.
Check it here: http://www.motoparking.club
npm install
pip install -r requirements.txt
npm run dev
in one console
python main.py
in another
Create heroku app, create mongo database.
Create heroku config vars: PROD_MONGODB
, MONGODB_DB
, SECRET_KEY
, SECURITY_PASSWORD_SALT
.
Deploy the code: git push heroku master
Frontend is writen using React.js, Fluxxor, Webpack, Leaflet.js, Babel, postCSS
components/
– React components.
components/dump/
– dump React components. Just view layer. They don't have access to the global state.
Everything should be passed to them throught props
.
components/smart/
– smart React components. They have access to the global state and pass portions of the state down to dump components. They don't have any visual representation and don't have any css styles. (Map.jsx
is exception and should be refactored)
flux/
– FLUX packages. Each package has actions, constants, client and store
styles/
– global and common styles.
BEM methodology is used for styling. Convention: BlockName_ElementName_modifierKey_ModifierValue
and BlockName_ElementName_booleanModifier
Styling of any component should be done in the file ComponentName.css
in the same directory as component file.
Run npm run csslint
to fix any css files with csscomb
.
Run npm run lint
to check code.
eslint-config-airbnb
is used with some modifications. "vars-on-top": 0
to make migration to let
and const
more easy. "quotes": [2, "double", "avoid-escape"]
because I hate single quotes. See .eslintrc
for more.
Server is writen in Python
using Flask
framework and MongoDB
. Server was developed in a short period of time so it is not perfect. It will be refactored soon.
All code is inside server/motoparking/
directory.
- ES2015
postCSSrefactor css- refactor map components and store to make them more reactive
- make stores more functional, without side effects to make migration to Redux more easy
- refactor server side code
Do you have one?