React Planner

screenshot of React Planner
react

:pencil2: A React Component for plans design. Draw a 2D floorplan and navigate it in 3D mode.

Overview:

react-planner is a React component that allows users to draw model buildings. It offers a drag & drop feature with a catalog of customizable objects, enabling users to transition from 2D wireframes to 3D models. Developers can enhance the catalog by adding new objects, providing users with a wide range of options for their designs.

Features:

  • Model Buildings: Draw model buildings in both 2D and 3D.
  • Drag & Drop: Easily move and place objects from a catalog.
  • Customizable Objects: Catalog includes ready-to-use objects that can be customized.

Summary:

react-planner is a versatile React component that simplifies the process of creating model buildings. With features like drag & drop functionality and customizable objects, users can design their buildings efficiently. Developers have the flexibility to expand the catalog with new objects, enhancing the overall user experience.

react
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

github-pages
GitHub Pages

Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading

Redux

Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.

webpack
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.