Skip to content

A mobile-first React prototyping tool with React-Bootstrap component integration

License

Notifications You must be signed in to change notification settings

oslabs-beta/Abstract

Repository files navigation

logo

PRs Welcome License: MIT Version Beta 1.0.0

Abstract Beta is a mobile first application focused on improving developer experience. Create mobile first application prototypes in real-time with proven UI frameworks such as React Bootstrap.


Table of Contents

Demo

Select Device Resolution for the Canvas

canvas-size-gif

Render Components on the Canvas

render-components-gif

Review Code

review-code-gif

Export Code

export-code-gif

Live Features

  1. Real-time live preview of your prototype including rendered components and styling.
  2. Prototype on multiple canvas sizes (e.g. iPad Pro and iPhone X).
  3. Code preview formatted and synchronized with the prototype render view.
  4. React-Bootstrap component integration.
  5. Export your prototype code to your Github account.
  6. Secure signup and login using Github OAuth.
  7. Installable progressive web application

How To Use

Web-based

  1. Visit abstractreact.herokuapp.com
  2. Login with a GitHub account

Running local

  1. Clone this repo
    git clone https://github.com/oslabs-beta/Abstract.git
    
  2. Navigate to your local directory
  3. Install dependencies
    npm install
    
  4. Run the client (verify that localhost port 3000 is not being used)
    npm start
    

Contribute

Abstract is an open-source product supported via the tech accelerator OS Labs/OS Labs-beta. We encourge all feedback and welcome all contributions. Note that this product does not have any full-time contributors. Expect that there will be a wait time before your pull request can be reviewed.

Contributors

How to contribute

  1. Fork the repo and create a new feature branch from dev.
  2. Any changes to the code base should include unit and/or integration tests.
  3. Ensure your code follows proper formatting recommendations.
  4. Create a pull request to the dev branch.

New feature log

  1. Drag and drop feature from the component menu onto the canvas
  2. Refactor to TypeScript
  3. Support TypeScript exports
  4. Add support for additional component libraries (Material UI, Chakra UI, etc)

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

About

A mobile-first React prototyping tool with React-Bootstrap component integration

Topics

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •