lore

Convention driven framework for building front-end applications using React/Redux. Heavily opinionated and highly respectful. Built on React, Webpack, Redux and React-Router.

Orientation

Lore's goal is to provide a framework that makes it easy to build React applications and is capable of supporting a mature real-world application. To understand how the framework makes it easier to get started with React, and what problems it's trying to solve, please see the intro video on the homepage or through this direct link.

If you're new to React, you may be interested in this video discussing the challenges building a React application from scratch as additional context on how Lore reduces the learning curve for React development.

Features

There are a lot of demands on front-end applications as they evolve to support the growing demands of the user base. Lore's goal is to build support for many of those common feature concerns into the architecture. Below is a list of UI concerns Lore addresses or is planning to address, linked to their documentation page:

• Data Structure
• AJAX Abstration Tier
• Filtering
• Pagination
• Infinite Scrolling
• WebSockets (real-time)
• Visual Cues
• Optimistic Updates
• Dialogs
• Wizards
• Error Handling
• 404 Pages

Documentation

The documentation for Lore is hosted at http://www.lorejs.org.

Tutorial

There is a tutorial for learning Lore on the website. It covers:

• Creating a new application
• Laying out your application visuals with mock data
• Routing
• Fetching data from an API server
• Populating your application with real data
• Generating and launching dialogs
• Authentication (logging users in)
• Authorization (restricting what users see)
• Resolving breaking API changes
• Pagination
• Infinite Scrolling
• Filtering data
• Normalizing API data
• Optimistic updates (displaying changes before server confirmation)
• Integrating Websockets for real-time behavior
• Building and publishing your application

Discussion

If you have any questions, feel free to create an issue. If you'd rather discuss over chat, there is a Lore Slack Team which you can join using this link.

Forms & Dialogs

While Lore provides a solution to create the types of experiences required of forms and dialogs, through its data structure and support for optimistic updates (such as detecting when a specific resource has suceeded or failed at being created, updated or deleted), the framework itself doesn't provide a direct solution for creating forms and dialogs, as too much about them is specific to the unique branding and experience requirements of an application.

There is however a related repository called lore-forms, that documents an approach for building forms and dialogs that you may like. To see if it appeals to you, you can follow the form construction tutorial on the website that builds up the patterns used by lore-forms from scratch.

You can find more documentation about lore-forms on the website at this link.

Near-term Focus

Since Lore is still in active development, I'm going to list the things that have immediate focus here.

1. [done] Simplify ability to extend lore-hook-connect with new blueprints and mappings (v0.12.3)
2. [done] Add Quickstart section to display new tweets at top of Feed (website link)
3. [done] Add Quickstart section to connect WebSockets for real-time behavior (website link)
4. [done] Update lore to load initializers after hooks (v0.12.4)
5. [done] Update all packages to ES6 syntax (import, export, const, let)
6. [done] Update all packages to supply a module export for tree-shaking
7. [done] Break out form-related packages into their own repo called lore-forms
8. [done] Update connect blueprints to more easily support uses cases like getting all data and merging local data with paginated data
9. [done] Replace references to React.PropTypes with react-prop-types
10. [done] Replace references to React.createClass with react-create-class
11. [done] Overhaul Quickstart (new steps, better patterns, better flow)
12. [done] Publish v0.13
13. [done] Generate es5 repo for Quickstart with branches for each step
14. [done] Generate es6 repo for Quickstart with branches for each step
15. [done] Generate esnext repo for Quickstart with branches for each step
16. [in-progress] Generate repo for Custom Hook Tutorial with branches for each step
17. Generate repo for Form Pattern Construction Tutorial with branches for each step
18. Send out Newsletter

Note about React Hot Reloading

Dan Abramov's Hot Reloading with Time Travel talk from React Europe 2015 demonstrated an incredible (and unique) value proposition for Redux and the functional programming concepts it uses as a foundation. That functionality has since been packaged into a library called react-hot-loader, which has gone through two major versions, with the beta version for v3 currently in development.

While there are tutorials that demonstrate how to obtain that functionality in React applications (webpack tutorial, react-hot-loader tutorial) the library itself does not currently work with react-router, which is why it's not included as part of the development environment for Lore.

Once those issues are resolved, Lore will investigate including it as a default development behavior, similar to the way the Redux DevTools are included by default starting in v0.12.

Thanks

• React for a brilliant componentization library for JavaScript.
• Redux for a simple and expressive React architecture.
• React Hot Loader/React Transform for making UI development a more fun and magical experience (even if it is about to be sunset).
• Sails for showing that a framework can be both strongly opinionated and highly respectful.
• Lerna for providing a sane solution for managing a monorepo.
• Storcery for providing the environment, discussion and impetus that gave birth to Lore.
• April Zero for showing just how beautiful web apps can be. Your creation continues to inspire.
• Backbone for a wonderfully well-thought-out interface for an API abstraction tier.
• Redux-Auth-Wrapper for demonstrating a simple and expressive way to handle authentication and authorization concerns.