Giter Club home page Giter Club logo

realworld-mithril's Introduction

RealWorld Example App

Mithril codebase containing real world examples (CRUD, auth, advanced patterns, etc) that adheres to the RealWorld spec and API.

This codebase was created to demonstrate a fully fledged fullstack application built with Mithril including CRUD operations, authentication, routing, pagination, and more.

We've gone to great lengths to adhere to the Mithril community styleguides & best practices.

For more information on how this works with other frontends/backends, head over to the RealWorld repo.

How it works

10 000 Foot View


                    +---------------+
                    |               |
            +------->  Component X  +-------+
            |       |               |       |
            |       +---------------+       |
            |                               |
 [store.prop reference]               (function call)
            |                               |
            |    +--------------------+     |
            |    |                    |     |
            -----+       domain       <-----+
                 |                    |
                 |    Updates its     |
                 |   internal state   |
                 |   in response to   |
                 |      API data      |
                 |                    |
                 +----------^---------+
                            |
                            |
                            V
                    (External API(s))

domain/index.js

Handles app-level concerns and is UI agnostic. It handles communication with the external API (which should be abstracted away into a separate module for larger apps). It has a basic store data object which can be (relatively) easily replaced by Redux, mobX, etc. with/out Immutable data structures. It has two public interfaces:

  • store is a way to read values
  • actions has a set of functions which can be called in order to mutate state

ui/router.js

[TODO Add detail]

ui/components/*.js

[TODO Add detail]

Getting started

You can view a live demo over at realworld-mithril.netlify.com

To get the frontend running locally:

  • Clone this repo
  • Run $ npm install to install all the required dependencies
  • Run $ npm start to start the local server and JS build

realworld-mithril's People

Contributors

barryels avatar ericsimons avatar willycamargo avatar anishkny avatar alonski avatar esakkiraj avatar

Watchers

James Cloos avatar  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.