The 3REE stack combines React, Redux, RethinkDB, and Express to create robust applications using just JavaScript. This guide will walk you through the process of setting up a Universal Javascript application, utilizing these powerful technologies. Let’s dive into the world of asynchronous data flows, real-time updates, and modular architecture!

Main Features of the 3REE Stack

• Universal (Isomorphic) Javascript Application
• Webpack 2’s Code Splitting and Tree Shaking capabilities
• Asynchronous Redux actions example
• RethinkDB Changefeeds for real-time UI updates

Why Use the 3REE Stack?

This project serves multiple purposes:

• Build a Universal Javascript application.
• Understand asynchronousity in Redux action creators.
• Utilize Socket.io with Redux for real-time communication.
• Leverage System.import() with React Router and Webpack2 for efficient code splitting.
• Fork it to build your own 3REE stack application.

Setting Up Your Local Environment

To start building with the 3REE stack, you’ll first need to set up your development environment:

1. Install RethinkDB (Instructions available here).
2. Clone the repository:

   git clone git@github.com:GordyD3ree.git

3. Use Node v6.0.0 (Consider using n for version management).
4. Run

   npm install

5. Customize your local configuration by creating a file named configlocal.json if necessary.
6. Run

   npm run db-setup

   to set up your database.

Running the Development Server

To launch your application in development mode, follow these steps:

• For Linux/macOS: Run

  npm start

• For Windows: Run

  npm run start:win

Navigate to http://localhost:3001 in two separate tabs. This setup allows you to witness real-time changes and the magic of Hot Module Replacement!

Running the Production Server

When you’re ready to roll out your application, you will need to perform the following steps:

1. Build the client using

   npm run build:prod

2. Ensure all required npm modules are installed on your production server with

   npm install --prod

3. Synchronize your application files to the server using Rsync.
4. Set up Nginx (or another web server) to route requests directed at your URL to http://localhost:3000.
5. Run your production server with

   npm run start:prod

6. Visit your production URL!

Note: Production has not been tested on Windows.

Troubleshooting

If you encounter issues while setting up or running your application, consider the following:

• Ensure your Node version is compatible (Node v6.0.0 is recommended).
• Check your database connection settings in configlocal.json.
• Verify all necessary npm modules are installed and up to date.
• If the demo application isn’t available, refer to the contact email: tanc@workshape.io.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

Conclusion

Combining these technologies allows for the creation of dynamic applications that can handle real-time data and provide a seamless experience for users. The synergy between React’s UI capabilities and Redux’s state management, alongside RethinkDB’s powerful database solutions, positions the 3REE stack as an innovative choice for developers.

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.