Overview

Flow-core is a base library required by any flow dependencies. It provides essential building blocks such as design system tokens, atoms, molecules, base themes, etc. The library is aimed at making it easier for developers to create projects by providing starter kits, a VScode plugin for easy access to components and documentation, and resources like documentation and Figma for designers. This product analysis will provide an overview of the key features, installation guide, and a summary of Flow-core.

Features

• Starter kits: Flow provides starter kits with basic dependencies to help developers get started quickly on new projects. Each starter kit includes Flow core, Flow system icons, default Google fonts, and fully functional Flow templates.
• VScode Plugin and debuggers: Flow offers a plugin for VScode that allows developers to access components, icons, values, and documentation within the editor. It also supports browser debuggers for Chrome, Firefox, and Safari.
• Components: Flow provides a collection of components that can be used in projects. Developers can visit the Flow components Storybook to explore and use these components.
• Templates: Flow offers templates that are fully functional and can be used as a starting point for different parts of a project, such as top navigation, profile, and left navigation. The Flow templates Storybook provides more details on these templates.
• Resources: Flow provides various resources for developers, including documentation and Figma files for designers. These resources can help developers understand and implement Flow in their projects.

Installation

To install Flow-core in an existing project, follow these steps:

1. Install Flow core by running the command: npm i --save @ollion/flow-core
2. After installation, restart your application.
3. Import Flow-core into your project’s startup file:
   • For VueJS, copy and import the snippet into src/main.ts or main.js.
   • For Angular, import Flow-core in src/main.ts.
   • For React, import Flow-core in src/index.tsx or index.jsx.
4. If your project uses Typescript (>4.5), include the following import for Vue or React:
   • Vue: Copy and paste the relevant line in your main.ts file.
   • React: Include the React type in tsconfig.json.
5. After adding the snippets, restart your application.

Summary

Flow-core is a base library that provides essential building blocks for projects. It offers starter kits with basic dependencies, a VScode plugin for easy access to components and documentation, a collection of components and templates, and various resources for developers. With its easy installation process and comprehensive features, Flow-core simplifies the development process and allows developers to create projects more efficiently.