From c9903bff031c27d7e6639130b47a4ebf09e7b82a Mon Sep 17 00:00:00 2001
From: Nimrod Kramer <41470823+nimrodkra@users.noreply.github.com>
Date: Sun, 20 Jul 2025 00:25:45 +0300
Subject: [PATCH] docs: enhance README with additional badges and developer
experience details
- Added new badges for React, Docusaurus, Node.js, Playwright, ESLint, and Prettier for better visibility of project dependencies.
- Updated Node.js version requirement to v20.12 or higher.
- Introduced a new section for developer experience, including one-click setup options and VSCode integration.
- Enhanced the available scripts section with new commands for testing and linting.
- Improved performance metrics presentation with visual badges for build time, bundle size, and Lighthouse scores.
---
README.md | 105 +++++++++++++++++++++++++++++++++++++++++++-----------
1 file changed, 84 insertions(+), 21 deletions(-)
diff --git a/README.md b/README.md
index 2db59cc..6b09fa5 100644
--- a/README.md
+++ b/README.md
@@ -6,38 +6,66 @@
[](https://github.com/dailydotdev/daily/blob/master/LICENSE)
[](https://github.com/dailydotdev/docs/graphs/contributors)
[](https://hub.docker.com/r/francescoxx/dailydev-docs)
+
+ [](https://reactjs.org/)
+ [](https://docusaurus.io/)
+ [](https://nodejs.org/)
+ [](https://playwright.dev/)
+ [](https://eslint.org/)
+ [](https://prettier.io/)
+
+ [](https://github.com/dailydotdev/docs/actions)
+ [](https://github.com/dailydotdev/docs/deployments)
+ [](https://bundlephobia.com/package/dailydev-docs)
+ [](https://codeclimate.com/github/dailydotdev/docs)
## ๐ฏ Overview
This repository contains the comprehensive documentation for [daily.dev](https://daily.dev), designed to help our community members get the most out of the platform. The documentation covers everything from getting started to advanced features and contribution guidelines.
+
+
### โจ Key Features
-- **๐ Comprehensive Guides**: Complete coverage of daily.dev features and functionality
-- **๐ Algolia Search**: Fast, integrated search across all documentation
-- **๐ Dark/Light Mode**: Theme toggle for comfortable reading
-- **๐ฑ Responsive Design**: Optimized for all devices
-- **โ๏ธ Edit Links**: Direct GitHub integration for community contributions
-- **๐ Fast Performance**: Built with Docusaurus 3 for optimal speed
+- **Comprehensive Guides**: Complete coverage of daily.dev features and functionality
+- **Algolia Search**: Fast, integrated search across all documentation
+- **Dark/Light Mode**: Theme toggle for comfortable reading
+- **Responsive Design**: Optimized for all devices
+- **Edit Links**: Direct GitHub integration for community contributions
+- **Fast Performance**: Built with Docusaurus 3 for optimal speed
## ๐ Performance Metrics
Our documentation site is optimized for speed and performance:
-- **Build Time**: ~45 seconds (production build)
-- **Bundle Size**: ~2.1MB (gzipped: ~580KB)
-- **Lighthouse Scores**:
- - ๐ Performance: 95+
- - โฟ Accessibility: 100
- - ๐ SEO: 100
- - ๐ก Best Practices: 100
+
+
+ 
+ 
+ 
+
+ **๐ Lighthouse Scores:**
+
+ 
+ 
+ 
+ 
+
+
## ๐ Quick Start
### Prerequisites
-- **Node.js**: v18.0 or higher
+- **Node.js**: v20.12 or higher
- **npm**: v7.0 or higher (or yarn/pnpm equivalent)
### Development Setup
@@ -59,16 +87,44 @@ npm start
The site will be available at `http://localhost:3000` with hot reload enabled.
+### ๐ ๏ธ Developer Experience
+
+**One-Click Setup:**
+- [](https://gitpod.io/#https://github.com/dailydotdev/docs)
+- [](https://codesandbox.io/s/github/dailydotdev/docs)
+
+**VSCode Integration:**
+```bash
+# Recommended extensions are auto-suggested
+# Settings and tasks are pre-configured in .vscode/
+code .
+```
+
+**Development Tools:**
+- ๐ฅ Hot reload with instant feedback
+- ๐ Built-in link validation
+- ๐ MDX syntax highlighting
+- ๐จ Real-time preview
+- ๐งช Integrated testing with Playwright
+
## ๐ Available Scripts
| Command | Description |
|---------|-------------|
| `npm start` | Start development server |
| `npm run build` | Build for production |
+| `npm run build:optimized` | Build with optimizations |
| `npm run serve` | Serve built site locally |
| `npm run clear` | Clear Docusaurus cache |
| `npm run docker:compose` | Build and run with Docker Compose |
| `npm run docker:run` | Run pre-built Docker image |
+| `npm test` | Run Playwright tests |
+| `npm run test:headed` | Run Playwright tests in headed mode |
+| `npm run test:ui` | Run Playwright tests with UI |
+| `npm run lint` | Run ESLint on source files |
+| `npm run lint:fix` | Run ESLint with auto-fix |
+| `npm run format` | Format code with Prettier |
+| `npm run format:check` | Check code formatting |
## ๐ณ Docker Development
@@ -79,7 +135,7 @@ docker compose up --build
### Using Pre-built Image
```bash
-docker run -p 3000:3000 francescoxx/dailydev-docs:0.9.3
+docker run -p 3000:3000 francescoxx/dailydev-docs:0.19.0
```
Both methods serve the site on `http://localhost:3000`.
@@ -88,17 +144,24 @@ Both methods serve the site on `http://localhost:3000`.
### Running Tests
-Currently, the project uses the following quality assurance processes:
+The project uses Playwright for end-to-end testing and additional quality assurance processes:
```bash
+# Run Playwright tests
+npm test
+
+# Run tests in headed mode (with browser UI)
+npm run test:headed
+
+# Run tests with Playwright UI
+npm run test:ui
+
# Build test (validates all content can be built)
npm run build
-# Link checking (validates all internal and external links)
-npm run build && npm run serve # Manual verification recommended
-
-# Markdown linting (if configured)
-npm run lint # Check for linting scripts in package.json
+# Code linting and formatting
+npm run lint
+npm run format:check
```
### Quality Checks
+
+
+ 
+
+