wiremapp / app

Quickly and easily visualise your application sitemap structure with a user-friendly interface, combined with a range of useful features, to help facilitate a rapid streamlined development process.

Wiremap

Quickly and easily visualise your application sitemap structure with a comprehensive & user-friendly interface, combined with a range of useful features, to help facilitate a rapid streamlined development process.

Features

• ✅ | Database Models
• ✅ | User Authentication
• ✅ | Create Sitemap
  1. ✅ | Add Cell
  2. ⬜️ | Edit Cell
  3. ⬜️ | Remove Cell
  4. ✅ | Add Element
  5. ⬜️ | Edit Element
  6. ⬜️ | Remove Element
  7. ✅ | Add Sub Element
  8. ⬜️ | Edit Sub Element
  9. ⬜️ | Remove Sub Element
• ✅ | Edit Sitemap
• ✅ | Remove Sitemap
• ⬜️ | User Settings
  1. • ⬜️ | Edit User Settings
  2. • ⬜️ | Create Organisation
  3. • ⬜️ | Edit Organisations
  4. • ⬜️ | Remove Organisations
  5. • ⬜️ | Add API key
  6. • ⬜️ | Remove API Key

Technologies

• Next.js
• Tailwinds
• TypeScript
• Markdown
• MongoDB

Application Structure

    flowchart TD
    35a89d93(Landing Page)-->46223490(Dashboard)
    46223490-->86r53891(Editor Page)
    35a89d93-->03dcc596(Static Page)
    03dcc596-->03dmm596(Privacy/Terms/Features)
    35a89d93-->T(Pricing)
    eb8f8865(Additional Pages)
    eb8f8865-->84c323c4L(User Settings)
    eb8f8865-->f88d271e(404)

Getting Started

1. Clone the repository:

   git clone https://github.com/wiremapp/app.git

2. Install the dependencies:

   npm i
   # or
   yarn

3. Copy the env.example to a new file env.local:

   cp .env.example .env.local

   env.example:

   NODE_ENV=
   NEXT_PUBLIC_STATIC_TITLE="An Open-Source Sitemap Visualiser"
   NEXT_PUBLIC_APP_TITLE="Wiremap"
   NEXT_PUBLIC_SITE_URL="https://wirem.app/"
   NEXTAUTH_URL="http://localhost:3000/"
   GOOGLE_OAUTH_CLIENT_ID=
   GOOGLE_OAUTH_CLIENT_SECRET=
   NEXTAUTH_SECRET=

4. Run the development server:

   npm run dev
   # or
   yarn dev

Open http://localhost:3000 with your browser to see the result.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.

Open http://localhost:3000 to view it in the browser.

npm test

Launches the test runner in the interactive watch mode.

See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.

See the section about deployment for more information.

Learn More

You can learn more in the React documentation.

License

This repository is open source. However, please note that no license file is included. As a result, the use of this repository or any of its material for any purpose beyond personal or educational use is not authorised.