Giter VIP home page Giter VIP logo

fast-creator's Introduction

Welcome to FAST Creator

An open source application for UI testing and development based on the work from the FAST Tooling project.

Overview

The Creator is a React application that allows for editing web components and native HTML elements with a live preview. To accomplish this, the Creator utilizes the web worker Message System from the @microsoft/fast-tooling package and a series of components and services provided by both the @microsoft/fast-tooling and @microsoft/fast-tooling-react packages.

Each component or service registers itself with the Message System and sends navigation and data updates to allow all services and components to remain in sync.

Some of the components being used include the <Form /> react component, used for editing data, the <Navigation /> component, used for navigating through data in the form of a tree view and the <Viewer /> component used to create an <iframe> which has width and height manipulations for different device orientations and dimensions. A few services being used are the AJV validation service, which checks and reports on the validity of data against a JSON schema, and the Monaco service which updates an instance of the Monaco Editor to remain in sync with the data and convert it back and forth from DataDictionary to html structures, as needed.

Getting Started

Setup instructions are located in the Contributors Guide.

  • Running the app locally: npm start
  • Build production app: npm run build

Testing

  • Run all tests: npm test
  • eslint all files: npm run eslint
  • Code format all files: npm run prettier

Troubleshooting

  • The application uses service-workers, which means views might not update as expected during the development process. To ensure files are updated when changed, configure your developer tools to update the assets on reload: As shown on Stack Overflow.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.