Overview

Flow-core is a base library required by any Flow dependencies. It consists of building blocks such as design and system tokens, atoms, molecules, and base themes. The library provides various features and functionalities that are essential for building projects with Flow.

Features

• Starter kits: Flow offers starter kits with basic dependencies to help you start a new project. These kits include Flow core, Flow system icons, default Google fonts, and fully functional Flow templates. Kits are available for Vue.js, Angular, and React.
• VScode Plugin and debuggers: Install Flow’s plugin to access components, icons, values, and documentation inside VScode. Browser debuggers are also available for Chrome, Firefox, and Safari.
• Components: Visit the Flow components Storybook to explore and use various UI components provided by Flow.
• Templates: Explore the Flow templates Storybook to find pre-designed templates for different use cases.
• Dependencies: Flow provides various dependencies such as Lineage, Form builder, Tables, Logs, Force graph, Themes, and Time-series.
• Resources: Access the Flow documentation and Figma resources for designers.
• VS code plugin: Install Flow’s plugin for VS code to enhance your development workflow.
• Get in touch: If you have any questions or would like to contribute, reach out to the Flow team at flow@cldcvr.com.

Installation

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

1. Install Flow core by running the following command:

yarn add @cldcvr/flow-core

2. After installation, restart your application.

For Vue.js:

• Paste the below snippet after the closing <template> in your App.vue file.

For React:

• Paste the below snippet in src/index.tsx or index.jsx file.

For Angular:

• Add the CSS file path in angular.json in the styles property array.

3. Import flow-core into your project by copying and importing the below snippet into your startup file:

• For Vue.js: Paste the snippet in src/main.ts or main.js file.
• For Angular: Paste the snippet in src/main.ts file.
• For React: Paste the snippet in src/index.tsx or index.jsx file.

4. If your project is Typescript enabled, add the import types:

• For Vue.js: Copy-paste the specific line in your main.ts file.
• For React: Include the React type in tsconfig.json.

Note: After adding the code snippets, restart your application.

Summary

Flow-core is a foundational library for building projects with Flow. It provides essential building blocks, starter kits, components, templates, and various dependencies. By installing Flow-core and following the installation guide, developers can leverage the features and functionalities offered by Flow to enhance their development workflow. Additionally, Flow offers a VScode plugin, documentation, and resources to support developers throughout the development process.