A webapp for generating flowcharts from text @ https://flowchart.fun
Flowchart Fun is a webapp for generating flowcharts from text built with React and cytoscape.js.
Node A
goes to: Node B
and: Node C
goes back to: (Node A)
Premium features including auth, hosted charts and permalinks are built using integrations with Vercel Functions, Supabase, Stripe and Sendgrid so you will need accounts with each of those services.
- Clone the repository
- Copy
.env.example
to.env
and add env variables pnpm install
andvercel dev
vercel dev
pnpm dev
Flowchart Fun uses Lingui for translations. These are the steps to follow:
- All text that should be translated should be wrapped in
<Trans>
component ort`
template string. These are imported from@lingui/macro
. - Strings are extracted with
pnpm -F app extract
. Then translations can be added to.po
files in/app/src/locales/[language]/messages.po
- When all translations are added, run
pnpm -F app compile
.
- You can run jest tests with
pnpm test
We use playwright for e2e tests. Playwright is always installed on the system so you need to globally install it at the correct version: 1.27.1
. You can find the version in the github e2e workflow file.
- Make sure playwright version 1.27.1 is installed globally
- Start the app with
vercel dev
and then runpnpm -F app e2e
pnpm -F app build && pnpm -F app analyze
- Branch from
dev
to develop a feature - Squash and merge the feature branch into
dev
- (Repeat until happy)
- Update version in /app/package.json and commit directly to
dev
. Push. - Open PR from
dev
tomain
- Merge (do not squash!) PR and a new github release will be created
We always welcome contributions! Before opening a pull request with a new feature, consider opening an issue or discussion to gauge support and/or confirm your implementation.