React Next D3
A simple dashboard template using Material UI, D3.js, React, Next.js, GraphQL and MongoDB
Overview
The Simple Dashboard is a React/Redux/Relay/Next.js dashboard template that utilizes Material UI. It offers a dark and light theme option and incorporates various technologies such as GraphQL, Formik, Mapbox GL, and more. The project follows a modular "ducks" project structure with a Dependency Injection Container and is comprised of MongoDB, Redis, API Servers, and Front Servers.
Features
- React/Redux with Hooks, Immutable, Thunk, Reselect, etc.
- GraphQL with subscriptions using React Relay Modern (not Apollo)
- Next.js with Webpack and Babel doing cached Server Side Rendering (SSR) on an Express.js backend with Redis and MongoDB via Mongoose
- Material UI with custom dark and light themes
- Internationalization using React Intl (Format.js) which supports ICU message syntax
- Formik, Mapbox GL, DeckGL, D3, Victory Chart, React Intl, React Virtualized, etc.
- Email/password or Twitter/Google/Facebook authorization using Passport.js
- Caching service worker from Google Workbox
- Modular "ducks" project structure with Dependency Injection Container
Summary
The Simple Dashboard is a powerful dashboard template built using React/Redux/Relay/Next.js and Material UI. It offers a range of features, including support for GraphQL, internationalization, and various libraries for data visualization. The project follows a modular project structure and utilizes MongoDB and Redis for data storage and caching. By following the installation guide, users can easily set up and start using the Simple Dashboard for their own applications.
- Next.js
Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.
- Ruby on Rails
Ruby on Rails, often referred to as Rails, is an open-source web application framework written in Ruby. Known for its convention over configuration and don't repeat yourself (DRY) principles, Rails simplifies and accelerates the development of database-backed web applications.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Graphql
A website that uses GraphQL as a query language to manage data fetching and state management. This includes features such as a strongly typed schema, client-side caching, and declarative data fetching to streamline data management and optimize website performance.
- Webpack
Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.