Code Monkey home page Code Monkey logo

captain-fact-frontend's Introduction

Discord AGPL3 Build Status



Getting started

If you're already have the API running locally, a simple npm install && npm start should be enough. Otherwise follow the procedure below:

  • Install (if you don't have them):

    • Docker and docker-compose (to start the API easily)
    • NodeJS, ideally using asdf-vm with NODEJS_CHECK_SIGNATURES=no asdf install
    • App dependencies: npm install
  • Run:

    • docker-compose up - Start the API
    • npm start - Start the front-end
    • npm run test - Runs all unit tests

Front-end is started on http://localhost:3333

A default account should have been created for you with e-mail=[email protected] and password=password.

Conventions

File structure

app
โ”œโ”€โ”€ API => API libraries for both REST API and websockets
โ”œโ”€โ”€ assets => Assets imported from JS
โ”œโ”€โ”€ components => All react components
โ”œโ”€โ”€ i18n => Translations
โ”œโ”€โ”€ lib => Misc utilities
โ”œโ”€โ”€ state => All redux related
โ”‚ย ย  โ”œโ”€โ”€ comments
โ”‚ย ย  โ”‚ย ย  โ”œโ”€โ”€ effects.js => Async actions creators, always return a promise
โ”‚ย ย  โ”‚ย ย  โ”œโ”€โ”€ record.js => The object representing a single comment
โ”‚ย ย  โ”‚ย ย  โ”œโ”€โ”€ reducer.js => Reducer + actions creators, always return an action object
โ”‚ย ย  โ”‚ย ย  โ””โ”€โ”€ selectors.js => Re-select selectors to select data in state
โ”‚ย ย  โ””โ”€โ”€ ...
โ”œโ”€โ”€ static => Static assets, directly copied to the public directory
โ”œโ”€โ”€ styles => Stylesheets in .sass format, all included from application.sass
โ””โ”€โ”€ router.jsx => Application router and main entry point

Styling

Styling is based on Bulma and was initially customized with SASS. However we now include styled-components, styled-system and @rebass/grid. This has become the prefered way to build new components.

Icons

We bundle a custom font icon built with IcoMoon. You can find scripts and config for this in dev/ but the preferred (and easiest) way to add new icons today is to use https://styled-icons.js.org/.

Main Libraries / Frameworks

Linked projects

License

GNU AFFERO GENERAL PUBLIC LICENSE Version 3

Permissions of this strongest copyleft license are conditioned on making available complete source code of licensed works and modifications, which include larger works using a licensed work, under the same license. Copyright and license notices must be preserved. Contributors provide an express grant of patent rights. When a modified version is used to provide a service over a network, the complete source code of the modified version must be made available.

See LICENSE for more info.

captain-fact-frontend's People

Contributors

betree avatar greenkeeper[bot] avatar boffire avatar dependabot-preview[bot] avatar comradekingu avatar dependabot-support avatar mansil avatar miragide avatar ngambini avatar vayel avatar spidersouris avatar weblate avatar julien-leclercq avatar manu1400 avatar rs232dz avatar najeal avatar wopata-ngambini avatar basileasti avatar facurossi avatar ge0 avatar nazmifr avatar fbn-ngambini avatar maitremanuel avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.