mrjmd
commented
7 years ago CURRENT COPY
Here are some features:
Ahead of Time Template Compiling
Templates are compiled into raw JavaScript for faster execution at runtime.
Service Worker / Offline Support
This site is offline-ready! Once you browse around a bit, feel free to try this feature by turning off your internet connection and continuing to browse.
Continuous Integration
Test suite, precache, and deployments are automatic as master branch changes.
Installable Web App
If you visit the site multiple times from a mobile phone (at least 5 minutes apart), you will be prompted to add the web app to your home screen. Icons and a splash page are included.
NEW PROPOSAL
About
What is Contenta Angular?
Thanks for checking out Contenta Angular! This site may look like a random recipe magazine, but there is a lot more going on here than may be obvious, and we are excited to tell you all about it. Contenta Angular is part of the Contenta family, a Drupal 8 distribution that is helping lower the barriers to entry for building decoupled sites with our favorite CMS.
This site is built by consuming data from Drupal's JSON API module into an Angular application. It is currently running the latest and greatest Angular 5.x release!
What's great about Contenta Angular?
This project has evolved really quickly over the summer of 2017, and we have a lot of features we're really proud of showcasing as "best practice" ways of building decoupled Drupal Angular applications. Our hope is that the examples here can go even further, to guide not just Drupal + Angular builds, but anyone wanting to build an Angular application. Here are some of the key pieces that we're excited about:
Drupal Runs the Data
Our backend is the public Contenta API, built on Drupal 8 using an incredible set of contributed modules like JSON API, JSON API Extras, OpenAPI, and more to make robust, flexible, but opinionated API's that keep Drupal firmly in charge of the data, while giving our application the ability to get just what we need, when we need it.
Angular CLI
We built this application using Angular's CLI, which gives developers a lot of power to scaffold out new components, run tests, spin up a development environment, and much more. Playing around with the CLI is a great way to introduce yourself to Angular.
Offline Capable
Service workers can do some really neat things, and we are using the Angular service worker to handle much of our configuration automatically. One special detail - our service worker is even caching our external API calls and images loaded from a remote server, so the entire site works offline, even the parts we request from elsewhere on the web!
Server Push
Firebase, our demo host, runs on HTTP/2 by default, so we can take advantage of new capabilities like server push. Our app, with the help of a small config library, is set up to begin pushing all essential js and css assets to you as soon as your initial request is made!
ngrx 4
Our state management solution follows best practices with the latest ngrx 4 library, based largely on the recent writing on the topic by Victor Savkin. The basic thinking is that many types of state changes are driven by the router as the source of truth, which follows the Redux pattern of using reducers to derive a new state from action. Things like remote API calls are treated as side effects, which can be triggered by an optimistic state change but then reversed if an API call fails, for example, while keeping state in perfect sync.
That may sound complex, but the end result is a careful and scalable approach to the various kinds of states our app needs to accommodate. It can be seen in action most readily by playing with the filters on our site - change a filter and it changes the URL in the address bar, which then triggers an action, a reducer, and any effects.
What's coming next?
We've got a lot more great features coming, keep an eye on our public roadmap.
We need a better high level overview of features for our features page - let's make sure anyone who stops by can see why Contenta Angular is awesome.