All Projects → sinnerschrader → Aem React

sinnerschrader / Aem React

Licence: mit
⚛ AEM templates and components based on React for server and client side. Provides a demo content package and core osgi bundle.

Programming Languages

javascript
184084 projects - #8 most used programming language
java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to Aem React

U360gts
The Universal 360º Continous Rotation Tracker System for Drones (UAVs, RPAs and FPV).
Stars: ✭ 113 (-20.42%)
Mutual labels:  universal
Knotx
Knot.x is a highly-efficient and scalable integration framework designed to build backend APIs
Stars: ✭ 119 (-16.2%)
Mutual labels:  aem
Next Advanced Apollo Starter
Advanced, but minimalistic Next.js pre-configured starter with focus on DX
Stars: ✭ 131 (-7.75%)
Mutual labels:  universal
Acs Aem Tools
Stars: ✭ 113 (-20.42%)
Mutual labels:  aem
Universal Collapsingtablayout
CollapsingToolbarLayout with TabLayout
Stars: ✭ 118 (-16.9%)
Mutual labels:  universal
Aem Sample We Retail
🚫 We.Retail has been archived, see instead the WKND Guide:
Stars: ✭ 121 (-14.79%)
Mutual labels:  aem
Koa React Universal
lightweight React-Koa2 universal boilerplate, only what is essential
Stars: ✭ 112 (-21.13%)
Mutual labels:  universal
Universal React Tutorial
📓 How to build universal web apps with React.
Stars: ✭ 136 (-4.23%)
Mutual labels:  universal
Uvue
Vue CLI plugin to create universal Vue applications with ease
Stars: ✭ 119 (-16.2%)
Mutual labels:  universal
Scoped Style
A tiny css in js library 🚀
Stars: ✭ 129 (-9.15%)
Mutual labels:  universal
Razzle
✨ Create server-rendered universal JavaScript applications with no configuration
Stars: ✭ 10,547 (+7327.46%)
Mutual labels:  universal
Universal React Apollo Example
Universal React Apollo App (GraphQL) consuming: https://github.com/WeLikeGraphQL/wordpress-graphql-api-example!
Stars: ✭ 117 (-17.61%)
Mutual labels:  universal
Callapp Lib
🔥call app from h5(H5唤起客户端 )
Stars: ✭ 1,857 (+1207.75%)
Mutual labels:  universal
Accesscontroltool
Rights and roles management for AEM made easy
Stars: ✭ 113 (-20.42%)
Mutual labels:  aem
Router5
Flexible and powerful universal routing solution
Stars: ✭ 1,704 (+1100%)
Mutual labels:  universal
React Redux Boilerplate
It is a boilerplate of React-Redux as the infrastructure, which helps to setup a Web APP quickly
Stars: ✭ 113 (-20.42%)
Mutual labels:  universal
Grabbit
Grabbit - Fast Content Sync tool for AEM/CQ
Stars: ✭ 119 (-16.2%)
Mutual labels:  aem
Angular9 Example App
Angular 13 Example App + Angular CLI + i18n + GraphQL
Stars: ✭ 1,769 (+1145.77%)
Mutual labels:  universal
Todomvc
Nuxt.js TodoMVC Example
Stars: ✭ 136 (-4.23%)
Mutual labels:  universal
Apollo Universal Starter Kit
Apollo Universal Starter Kit is an SEO-friendly, fully-configured, modular starter application that helps developers to streamline web, server, and mobile development with cutting-edge technologies and ultimate code reuse.
Stars: ✭ 1,645 (+1058.45%)
Mutual labels:  universal

Adobe Experience Manager ("AEM") components written in React


This project makes it possible to render Adobe Experience Manager ("AEM") components via React.

STATUS

Build Status Maven Central

  • Version: 0.4
  • API is unstable

Documentation

An comprehensive documentation is being developed.

Deploy / install the demo

You can download the demo content package from here and deploy it to your local AEM instance. View the demo

To install the demo locally:

git clone https://github.com/sinnerschrader/aem-react.git

cd aem-react

mvn clean install -PautoInstallPackage -Dgpg.skip=true

##Trouble shooting

Nashorn engine erro: "No such function renderReactComponent"

Check configuration of ReactScriptEngine in webconsole:

  • go to /system/console/configMgr
  • search for "react" in the browser
  • open the configuration of "ReactJs Script Engine Factory"
  • important: jcr path must be "/etc/designs/react-demo/js/react-demo/server.js/jcr:content"
  • if it is not then update it.

Background

Nowadays every web application contains at least some highly interactive ui components that are implemented via javascript in the client.

React is one of the most popular javascript web frameworks today. React makes client-side web application development as easy as good old server side web development because of its "render everthing" ansatz. The developer doesn't need to think about the minimal set of dom manipulations to get to the next state of the ui but instead defines the new state and the framework handles the dom manipulation.

React can be directly used in conjunction with AEM for client-side tasks. Unfortunately that means that the dom that Reactjs handles will not be rendered on the server and thus will not be available on first page load and requires extra work to be indexable by search engines. This project makes it possible to render AEM components with React on the server.

License

MIT

Contribution

Contributions are welcome!

The repository contains the OSGI bundle in the folder core. In the folder demo is a demo project that can be used as a starting point for your own project.

OSGI core bundle

The maven module in ./core contains the implementation of the AEM component type and the pool of nashorn engines.

Demo content package

The maven module in ./demo defines a demo content package that includes some example components and demo pages.

Javascript library

The javascript library is required and integrated by the build tools in the demo project.

Dependencies

  • = Java 8 (Oracle JDK with nashorn engine)

  • = AEM 6.0

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].