diff --git a/README.md b/README.md
index a10cf48..fc3a7e0 100644
--- a/README.md
+++ b/README.md
@@ -70,6 +70,12 @@ By default the code is executed on the server. When you want to change this beha
'use client';
```
+Its possible to render the most parts of an app on the server and some components, like the hover state of the navbar, on the client. Depending on what makes most sense for the application. Thoose components should be move to a separated JS or JSX file.
+
+The main function of the app or just a file is defined by `export default`.
+
+The layout of the app is defined in `layout.js`. The content of `layout.js` is shared between all pages.
+
## Upgrade to newer Next.js version
```zsh
diff --git a/docs/react/README.md b/docs/react/README.md
index 13ac758..2416c70 100644
--- a/docs/react/README.md
+++ b/docs/react/README.md
@@ -180,7 +180,22 @@ function HomePage(){
}
```
+## Migrate project from React to Next.js
+Install React & Next.js
+```zsh
+npm install react@latest react-dom@latest next@latest
+```
+Dependencies in package.json:
+```json
+{
+ "dependencies": {
+ "next": "^15.3.1",
+ "react": "^19.1.0",
+ "react-dom": "^19.1.0"
+ }
+}
+```
## Ressources
- [React Foundations course from Next.js](https://nextjs.org/learn/react-foundations)
\ No newline at end of file
diff --git a/react-foundations-course/nextjs/.gitignore b/react-foundations-course/nextjs/.gitignore
new file mode 100644
index 0000000..5ef6a52
--- /dev/null
+++ b/react-foundations-course/nextjs/.gitignore
@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
diff --git a/react-foundations-course/nextjs/app/layout.js b/react-foundations-course/nextjs/app/layout.js
new file mode 100644
index 0000000..8525f5f
--- /dev/null
+++ b/react-foundations-course/nextjs/app/layout.js
@@ -0,0 +1,12 @@
+export const metadata = {
+ title: 'Next.js',
+ description: 'Generated by Next.js',
+}
+
+export default function RootLayout({ children }) {
+ return (
+
+ {children}
+
+ )
+}
diff --git a/react-foundations-course/nextjs/app/like-button.jsx b/react-foundations-course/nextjs/app/like-button.jsx
new file mode 100644
index 0000000..c1b1099
--- /dev/null
+++ b/react-foundations-course/nextjs/app/like-button.jsx
@@ -0,0 +1,13 @@
+'use client';
+
+import { useState } from 'react';
+
+export default function LikeButton(){
+ const [likes, setLikes] = useState(0);
+
+ function handleClick(){
+ setLikes(likes + 1);
+ }
+
+ return Like ({likes}) ;
+}
\ No newline at end of file
diff --git a/react-foundations-course/nextjs/app/page.jsx b/react-foundations-course/nextjs/app/page.jsx
new file mode 100644
index 0000000..a29e5e6
--- /dev/null
+++ b/react-foundations-course/nextjs/app/page.jsx
@@ -0,0 +1,24 @@
+import LikeButton from "./like-button";
+
+function Header({ title }){
+ return ({title ? title : 'Default title'} );
+}
+
+export default function HomePage(){
+ const names = ['Max Meier', 'Josef Berchtold', 'Margrit Barmettler'];
+
+ return (
+
+
+
+
+
+ {names.map((name) => (
+ {name}
+ ))}
+
+
+
+