Free, simple, and intuitive online database diagram editor and SQL generator.
Go to file
alphazee09 317e464c7b Enhance TypesContext and useFullscreen with improvements for robustness and usability
**Changes to TypesContextProvider:**
1. **Added TypeScript Type Annotations:**
   - Added TypeScript types for props and state to improve type safety and maintainability.

2. **Improved History Management:**
   - Ensured that changes are properly handled with undo and redo stacks and consistent state updates.

3. **Updated Add and Delete Methods:**
   - Improved addType and deleteType methods to correctly manage history and ensure consistent state updates.

4. **Adjusted State Management:**
   - Ensured state updates are correctly handled and unnecessary operations are minimized.

**Changes to useFullscreen Hook:**
1. **Replaced useEventListener with Native DOM API:**
   - Switched from `useEventListener` to `document.addEventListener` for clearer control over event listener lifecycle and to avoid potential issues with third-party hooks.

2. **Utilized useEffect for Cleanup:**
   - Moved event listener management into `useEffect` for proper attachment and cleanup, preventing potential memory leaks and ensuring efficient event handling.

3. **Improved State Initialization:**
   - Used a function for initializing state to ensure it is computed only once, improving performance.

**Why These Changes:**
- **Type Safety and Clarity:** Adding TypeScript annotations and improving state management helps in catching potential issues early and makes the code more predictable and easier to maintain.
- **Event Listener Management:** Using native DOM methods and `useEffect` ensures that event listeners are properly managed and cleaned up, reducing the risk of memory leaks and improving performance.
- **State Initialization:** Efficient state initialization improves performance and ensures that the initial state is set correctly.

These changes improve the robustness, maintainability, and performance of the `TypesContext` and `useFullscreen` components.
2024-08-08 20:10:29 +04:00
.github Add buy me a coffee to funding 2024-08-04 16:02:54 +03:00
public Add robots.txt 2024-04-06 05:19:13 +03:00
src Enhance TypesContext and useFullscreen with improvements for robustness and usability 2024-08-08 20:10:29 +04:00
.dockerignore Create .dockerignore 2024-05-22 15:17:07 +03:00
.env.sample Fix env variables 2024-03-15 21:09:50 +02:00
.eslintrc.cjs Add prettier 2024-04-06 11:11:12 +03:00
.gitignore Migrate to Vite from CRA 2023-12-16 05:39:13 +02:00
.prettierrc.json Add prettier 2024-04-06 11:11:12 +03:00
compose.yml Expose host directly in compose 2024-06-01 20:53:07 +03:00
CONTRIBUTING.md Create CONTRIBUTING.md 2024-05-22 14:59:41 +03:00
Dockerfile Fix dockerfile comments 2024-04-14 10:20:14 +03:00
drawdb.gif Update Readme 2024-04-06 12:39:13 +03:00
index.html Remove fa kit 2024-08-05 15:46:57 +03:00
LICENSE Update LICENSE 2024-07-21 17:00:32 +03:00
package-lock.json Refactor AreasContextProvider: Add context export, custom hook, PropTypes validation, and error handling 2024-08-08 19:42:50 +04:00
package.json Refactor AreasContextProvider: Add context export, custom hook, PropTypes validation, and error handling 2024-08-08 19:42:50 +04:00
postcss.config.js Migrate to Vite from CRA 2023-12-16 05:39:13 +02:00
README.md fix: update remaining vercel urls to drawdb.app 2024-07-13 12:58:36 +02:00
tailwind.config.js Redo signup page 2024-01-03 21:37:44 +02:00
vercel.json Add vercel.json 2024-02-27 15:16:14 +02:00
vite.config.js Migrate to Vite from CRA 2023-12-16 05:39:13 +02:00

drawdb logo

Free, simple, and intuitive database design tool and SQL generator.

drawDB · Discord · X

demo

drawDB

DrawDB is a robust and user-friendly database entity relationship (DBER) editor right in your browser. Build diagrams with a few clicks, export sql scripts, customize your editor, and more without creating an account. See the full set of features here.

Getting Started

Local Development

git clone https://github.com/drawdb-io/drawdb
cd drawdb
npm install
npm run dev

Build

git clone https://github.com/drawdb-io/drawdb
cd drawdb
npm install
npm run build

Docker Build

docker build -t drawdb .
docker run -p 3000:80 drawdb

Set up the server and environment variables according to .env.sample for the survey and bug report forms.