![](https://private-user-images.githubusercontent.com/49924090/303139248-c72d6c51-deb4-44f9-9b9d-9d96b7e694fb.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ2MTAxOTYsIm5iZiI6MTcyNDYwOTg5NiwicGF0aCI6Ii80OTkyNDA5MC8zMDMxMzkyNDgtYzcyZDZjNTEtZGViNC00NGY5LTliOWQtOWQ5NmI3ZTY5NGZiLmpwZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjUlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI1VDE4MTgxNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTJhMDczN2NlNTdkNzY3MjY4OTljODkzOTM4YTI0NzJlNjk0ODAzZWZhZjQ0NDVhYmQ5ODczYmEzMzljOWRkOTcmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.J94P1Y910O7IlsF9y0Hf7_ihEAwpS4lfXAkW33ZbnyY)
Demo built with Next.js using partial rendering experimental feature with Suspense API.
- Partial Rendering: Allow to render rest of the page in same time an heavy operations is happening like fetching data from server and display fallback UI until data is fetched.
Next.js.Partial.Hydration.Example.mp4
-
Clone the repository:
git clone https://github.com/Shaban-Eissa/Next.js-Partial-Rendering
-
Install dependencies:
cd Next.js-Partial-Rendering npm install
-
Run the application:
npm run dev
The application will be accessible at
http://localhost:3000
.
This project utilizes a robust stack of modern technologies for efficient development and optimal user experience:
- Next.js
- Typescript
- Partial Rendering
- Tailwind CSS
Contributions are welcome! Please follow these guidelines:
- Fork the repository.
- Create a new branch for your feature/bugfix:
git checkout -b feature-name
. - Commit your changes:
git commit -m 'Add some feature'
. - Push to the branch:
git push origin feature-name
. - Open a pull request.