mirror of
https://github.com/arthur-pbty/learn.git
synced 2026-06-03 15:07:30 +02:00
feat: add new features including SEO, sitemap, and subjects management
- Create robots.txt to allow search engine indexing and specify sitemap location. - Implement ajouterSujet.js for adding new subjects to sujets.json. - Develop dynamic subject pages in page.tsx using static generation with metadata. - Add contact, error, not found, and privacy policy pages for improved user experience. - Generate sitemap.xml for better search engine visibility. - Create SEO component for managing page metadata. - Populate sujets.json with detailed subject information for dynamic content rendering.
This commit is contained in:
Puechberty Arthur
@@ -39,3 +39,6 @@ yarn-error.log*
|
||||
# typescript
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
|
||||
# local editor settings
|
||||
.vscode/
|
||||
|
||||
@@ -1,36 +1,71 @@
|
||||
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
|
||||
# Learn - Site de sujets populaires
|
||||
|
||||
## Getting Started
|
||||
Application Next.js orientee SEO qui publie des pages de contenu autour de sujets populaires.
|
||||
|
||||
First, run the development server:
|
||||
Site en ligne: https://learn.arthurp.fr
|
||||
|
||||
## Objectif
|
||||
|
||||
- Publier des pages categories optimisees SEO
|
||||
- Gerer une base de sujets via un fichier JSON
|
||||
- Proposer une structure simple a maintenir et deployee facilement
|
||||
|
||||
## Stack technique
|
||||
|
||||
- Next.js 16 (App Router)
|
||||
- React 19
|
||||
- TypeScript
|
||||
- Tailwind CSS 4
|
||||
|
||||
## Structure principale
|
||||
|
||||
- src/app: pages et routes
|
||||
- src/components: composants reutilisables (SEO, etc.)
|
||||
- src/data/sujets.json: donnees de contenu
|
||||
- public/images: images statiques
|
||||
- scripts/ajouterSujet.js: script utilitaire pour ajouter un sujet
|
||||
|
||||
## Lancer en local
|
||||
|
||||
Prerequis:
|
||||
|
||||
- Node.js 20+
|
||||
- npm
|
||||
|
||||
Installation et lancement:
|
||||
|
||||
```bash
|
||||
npm install
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
# or
|
||||
pnpm dev
|
||||
# or
|
||||
bun dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
Application disponible sur http://localhost:3000
|
||||
|
||||
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
|
||||
## Scripts utiles
|
||||
|
||||
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
|
||||
- npm run dev: demarrage en mode developpement
|
||||
- npm run build: build de production
|
||||
- npm run start: lancement de la build
|
||||
- npm run lint: verification ESLint
|
||||
|
||||
## Learn More
|
||||
## Deploiement
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
Build de verification avant publication:
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
```bash
|
||||
npm run lint
|
||||
npm run build
|
||||
```
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
|
||||
Ensuite, pousser sur GitHub puis deployer sur la plateforme cible.
|
||||
|
||||
## Deploy on Vercel
|
||||
## SEO et backlinks
|
||||
|
||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
||||
- URL principale: https://learn.arthurp.fr
|
||||
- Ce depot documente le projet public pour renforcer le maillage vers le site principal.
|
||||
|
||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
|
||||
## Securite avant push
|
||||
|
||||
- Les fichiers d'environnement (.env*) sont ignores
|
||||
- Les fichiers locaux VS Code (.vscode/) sont ignores
|
||||
- Verifier qu'aucune cle API ou secret n'est commite avant publication
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
services:
|
||||
nextjs-app:
|
||||
image: node:20
|
||||
working_dir: /app
|
||||
volumes:
|
||||
- ./:/app
|
||||
command: sh -c "npm install && npm run build && npm run start"
|
||||
ports:
|
||||
- "3003:3000"
|
||||
restart: unless-stopped
|
||||
@@ -0,0 +1,3 @@
|
||||
// Ce fichier est généré automatiquement pour Next.js SSG SEO
|
||||
|
||||
export {};
|
||||
Generated
+1323
-13
File diff suppressed because it is too large
Load Diff
+4
-2
@@ -11,7 +11,9 @@
|
||||
"dependencies": {
|
||||
"next": "16.1.6",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3"
|
||||
"react-dom": "19.2.3",
|
||||
"react-markdown": "^10.1.0",
|
||||
"ts-node": "^10.9.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
@@ -21,6 +23,6 @@
|
||||
"eslint": "^9",
|
||||
"eslint-config-next": "16.1.6",
|
||||
"tailwindcss": "^4",
|
||||
"typescript": "^5"
|
||||
"typescript": "^5.9.3"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
|
||||
|
Before Width: | Height: | Size: 391 B |
@@ -1 +0,0 @@
|
||||
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 145 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 300 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 609 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 454 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 85 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -0,0 +1,3 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
Sitemap: https://learn.arthurp.fr/sitemap.xml
|
||||
@@ -1 +0,0 @@
|
||||
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
|
||||
|
Before Width: | Height: | Size: 128 B |
@@ -1 +0,0 @@
|
||||
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
|
||||
|
Before Width: | Height: | Size: 385 B |
@@ -0,0 +1,24 @@
|
||||
import fs from 'fs';
|
||||
|
||||
/**
|
||||
* Ajoute un nouveau sujet au fichier sujets.json
|
||||
* @param {object} sujet - Objet sujet à ajouter
|
||||
*/
|
||||
export function ajouterSujet(sujet) {
|
||||
const filePath = './src/data/sujets.json';
|
||||
const data = JSON.parse(fs.readFileSync(filePath, 'utf-8'));
|
||||
data.push(sujet);
|
||||
fs.writeFileSync(filePath, JSON.stringify(data, null, 2));
|
||||
}
|
||||
|
||||
/**
|
||||
* Exemple d’utilisation :
|
||||
* ajouterSujet({
|
||||
* slug: 'nouveau-sujet',
|
||||
* title: 'Titre',
|
||||
* description: 'Description',
|
||||
* image1: { src: '/images/xxx.jpg', alt: '...' },
|
||||
* image2: { src: '/images/yyy.jpg', alt: '...' },
|
||||
* sections: [ ... ]
|
||||
* });
|
||||
*/
|
||||
@@ -0,0 +1,81 @@
|
||||
import { notFound } from 'next/navigation';
|
||||
import SEO from '@/components/SEO';
|
||||
import sujets from '@/data/sujets.json';
|
||||
import Image from 'next/image';
|
||||
import React from 'react';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
|
||||
export const dynamicParams = false; // SSG only
|
||||
|
||||
export async function generateStaticParams() {
|
||||
return sujets.map((sujet) => ({ slug: sujet.slug }));
|
||||
}
|
||||
|
||||
|
||||
// Correction Next.js 14+ : params peut être une Promise
|
||||
export async function generateMetadata({ params }: { params: { slug: string } } | { params: Promise<{ slug: string }> }) {
|
||||
const { slug } = await params;
|
||||
const sujet = sujets.find((s) => s.slug === slug);
|
||||
if (!sujet) return {};
|
||||
return {
|
||||
title: sujet.title,
|
||||
description: sujet.description,
|
||||
openGraph: {
|
||||
title: sujet.title,
|
||||
description: sujet.description,
|
||||
images: [sujet.image1.src],
|
||||
url: `/${sujet.slug}`,
|
||||
type: 'article',
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
// Next.js 14+ : params peut être un Promise
|
||||
export default async function SujetPage({ params }: { params: { slug: string } } | { params: Promise<{ slug: string }> }) {
|
||||
const { slug } = await params;
|
||||
const sujet = sujets.find((s) => s.slug === slug);
|
||||
if (!sujet) return notFound();
|
||||
type Section = {
|
||||
h2: string;
|
||||
content: string;
|
||||
h3?: string;
|
||||
};
|
||||
const sections: Section[] = Array.isArray(sujet.sections) ? sujet.sections : [];
|
||||
|
||||
return (
|
||||
<>
|
||||
<SEO
|
||||
title={sujet.title}
|
||||
description={sujet.description}
|
||||
image={sujet.image1.src}
|
||||
url={`/${sujet.slug}`}
|
||||
/>
|
||||
<main className="max-w-3xl mx-auto py-10 px-4">
|
||||
<h1 className="text-3xl font-bold mb-4 text-black">{sujet.title}</h1>
|
||||
<div className="flex flex-col md:flex-row gap-6 mb-6">
|
||||
<Image src={sujet.image1.src} alt={sujet.image1.alt} width={500} height={300} className="rounded w-full md:w-1/2 object-cover" />
|
||||
{sujet.image2 && (
|
||||
<Image src={sujet.image2.src} alt={sujet.image2.alt} width={500} height={300} className="rounded w-full md:w-1/2 object-cover" />
|
||||
)}
|
||||
</div>
|
||||
{sections.map((section, idx) => (
|
||||
<React.Fragment key={idx}>
|
||||
<section className="mb-8">
|
||||
<h2 className="text-2xl font-semibold mb-2 text-black">{section.h2}</h2>
|
||||
{section.h3 && <h3 className="text-xl font-medium mb-1 text-zinc-700">{section.h3}</h3>}
|
||||
<div className="text-zinc-700 leading-7">
|
||||
<ReactMarkdown>{section.content}</ReactMarkdown>
|
||||
</div>
|
||||
</section>
|
||||
{/* Emplacement pub entre sections (après la première section) */}
|
||||
{idx === 0 && (
|
||||
<div className="ad-inpage my-8 flex justify-center">
|
||||
<div className="bg-zinc-100 rounded p-2 text-xs text-zinc-500">[Publicité In-Page 336x280]</div>
|
||||
</div>
|
||||
)}
|
||||
</React.Fragment>
|
||||
))}
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
export default function Contact() {
|
||||
return (
|
||||
<main className="max-w-2xl mx-auto py-12 px-4">
|
||||
<h1 className="text-3xl font-bold mb-4 text-black">Contact</h1>
|
||||
<p className="mb-4 text-zinc-700">Pour toute question ou demande, contactez-nous à l’adresse suivante :</p>
|
||||
<a href="mailto:contact@sujets-populaires.fr" className="text-blue-700 underline">contact@sujets-populaires.fr</a>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
"use client";
|
||||
|
||||
export default function GlobalError({ error, reset }: { error: Error; reset: () => void }) {
|
||||
return (
|
||||
<main className="min-h-screen flex flex-col items-center justify-center bg-zinc-50 px-4">
|
||||
<h1 className="text-5xl font-bold text-black mb-4">Erreur</h1>
|
||||
<h2 className="text-2xl text-zinc-700 mb-2">Une erreur est survenue</h2>
|
||||
<p className="text-zinc-700 mb-6">{error.message}</p>
|
||||
<button onClick={reset} className="text-blue-700 underline">Réessayer</button>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
+1
-6
@@ -12,12 +12,7 @@
|
||||
--font-mono: var(--font-geist-mono);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--background: #0a0a0a;
|
||||
--foreground: #ededed;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
background: var(--background);
|
||||
|
||||
+45
-7
@@ -1,6 +1,8 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Geist, Geist_Mono } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import Link from 'next/link';
|
||||
import sujets from '@/data/sujets.json';
|
||||
|
||||
const geistSans = Geist({
|
||||
variable: "--font-geist-sans",
|
||||
@@ -13,8 +15,8 @@ const geistMono = Geist_Mono({
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
title: "Sujets Populaires",
|
||||
description: "Articles originaux sur des sujets populaires.",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
@@ -23,11 +25,47 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
>
|
||||
{children}
|
||||
<html lang="fr">
|
||||
<body className={`${geistSans.variable} ${geistMono.variable} antialiased bg-zinc-50`}>
|
||||
<header className="w-full bg-white shadow mb-8 relative">
|
||||
{/* Emplacement pub header */}
|
||||
<div className="w-full flex justify-center bg-zinc-100 py-2">
|
||||
{/* AdSense : remplacer par le script réel */}
|
||||
<div className="ad-header text-xs text-zinc-500">[Publicité Header 728x90]</div>
|
||||
</div>
|
||||
<nav className="max-w-5xl mx-auto flex flex-wrap items-center justify-between py-4 px-6">
|
||||
<Link href="/" className="text-2xl font-bold text-blue-700">Sujets Populaires</Link>
|
||||
<ul className="flex flex-wrap gap-4">
|
||||
{sujets.map((s) => (
|
||||
<li key={s.slug}>
|
||||
<Link href={`/${s.slug}`} className="text-zinc-700 hover:underline">
|
||||
{s.title.split(':')[0]}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<div className="flex max-w-5xl mx-auto w-full">
|
||||
{/* Sidebar pub desktop */}
|
||||
<aside className="hidden lg:block w-56 shrink-0 mt-4">
|
||||
<div className="sticky top-24">
|
||||
<div className="ad-sidebar bg-zinc-100 rounded p-2 text-xs text-zinc-500 mb-4">[Publicité Sidebar 300x600]</div>
|
||||
</div>
|
||||
</aside>
|
||||
<main className="min-h-[70vh] flex-1">{children}</main>
|
||||
</div>
|
||||
<footer className="w-full bg-zinc-100 py-6 mt-12 border-t border-zinc-200">
|
||||
<div className="max-w-5xl mx-auto flex flex-col md:flex-row justify-between items-center px-6 gap-2">
|
||||
<div className="text-zinc-600 text-sm">© {new Date().getFullYear()} Sujets Populaires. Tous droits réservés.</div>
|
||||
<div className="flex gap-4 text-sm">
|
||||
<Link href="/contact" className="hover:underline text-zinc-700">Contact</Link>
|
||||
<Link href="/politique-confidentialite" className="hover:underline text-zinc-700">Politique de confidentialité</Link>
|
||||
</div>
|
||||
{/* Emplacement pub footer */}
|
||||
<div className="ad-footer text-xs text-zinc-500 mt-4">[Publicité Footer 728x90]</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function NotFound() {
|
||||
return (
|
||||
<main className="min-h-screen flex flex-col items-center justify-center bg-zinc-50 px-4">
|
||||
<h1 className="text-5xl font-bold text-black mb-4">404</h1>
|
||||
<h2 className="text-2xl text-zinc-700 mb-2">Page non trouvée</h2>
|
||||
<p className="text-zinc-700 mb-6">La page que vous cherchez n’existe pas ou a été déplacée.</p>
|
||||
<Link href="/" className="text-blue-700 underline">Retour à l’accueil</Link>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
+39
-56
@@ -1,65 +1,48 @@
|
||||
import Image from "next/image";
|
||||
import Link from 'next/link';
|
||||
import Image from 'next/image';
|
||||
import SEO from '@/components/SEO';
|
||||
import sujetsData from '@/data/sujets.json';
|
||||
|
||||
type Sujet = {
|
||||
slug: string;
|
||||
title: string;
|
||||
description: string;
|
||||
image1: {
|
||||
src: string;
|
||||
alt: string;
|
||||
};
|
||||
};
|
||||
|
||||
const sujets = sujetsData as Sujet[];
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
|
||||
<main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
|
||||
<Image
|
||||
className="dark:invert"
|
||||
src="/next.svg"
|
||||
alt="Next.js logo"
|
||||
width={100}
|
||||
height={20}
|
||||
priority
|
||||
<>
|
||||
<SEO
|
||||
title="Accueil - Sujets Populaires"
|
||||
description="Découvrez nos articles sur des sujets populaires : IA, voyage, énergie, alimentation, code et plus encore."
|
||||
url="/"
|
||||
/>
|
||||
<div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
|
||||
<h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
|
||||
To get started, edit the page.tsx file.
|
||||
</h1>
|
||||
<p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
|
||||
Looking for a starting point or more instructions? Head over to{" "}
|
||||
<a
|
||||
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
className="font-medium text-zinc-950 dark:text-zinc-50"
|
||||
>
|
||||
Templates
|
||||
</a>{" "}
|
||||
or the{" "}
|
||||
<a
|
||||
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
className="font-medium text-zinc-950 dark:text-zinc-50"
|
||||
>
|
||||
Learning
|
||||
</a>{" "}
|
||||
center.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
|
||||
<a
|
||||
className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
|
||||
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<main className="min-h-screen bg-zinc-50 py-12 px-4">
|
||||
<h1 className="text-4xl font-bold mb-8 text-center text-black">Sujets Populaires</h1>
|
||||
<ul className="grid gap-8 md:grid-cols-2 lg:grid-cols-3">
|
||||
{sujets.map((sujet) => (
|
||||
<li key={sujet.slug} className="bg-white rounded-lg shadow p-6 flex flex-col items-center">
|
||||
<Link href={`/${sujet.slug}`} className="w-full">
|
||||
<Image
|
||||
className="dark:invert"
|
||||
src="/vercel.svg"
|
||||
alt="Vercel logomark"
|
||||
width={16}
|
||||
height={16}
|
||||
src={sujet.image1.src}
|
||||
alt={sujet.image1.alt}
|
||||
className="rounded w-full h-40 object-cover mb-4"
|
||||
width={400}
|
||||
height={160}
|
||||
/>
|
||||
Deploy Now
|
||||
</a>
|
||||
<a
|
||||
className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
|
||||
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Documentation
|
||||
</a>
|
||||
</div>
|
||||
<h2 className="text-2xl font-semibold mb-2 text-black">{sujet.title}</h2>
|
||||
<p className="text-zinc-700">{sujet.description}</p>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</main>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
export default function PolitiqueConfidentialite() {
|
||||
return (
|
||||
<main className="max-w-2xl mx-auto py-12 px-4">
|
||||
<h1 className="text-3xl font-bold mb-4 text-black">Politique de confidentialité</h1>
|
||||
<p className="mb-4 text-zinc-700">Nous respectons votre vie privée. Aucune donnée personnelle n’est collectée sans votre consentement explicite. Pour toute question, contactez-nous.</p>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import sujets from '@/data/sujets.json';
|
||||
|
||||
export async function GET() {
|
||||
const baseUrl = 'https://learn.arthurp.fr'; // À personnaliser
|
||||
const staticPages = [
|
||||
'',
|
||||
'/contact',
|
||||
'/politique-confidentialite',
|
||||
];
|
||||
const sujetPages = sujets.map((s) => `/${s.slug}`);
|
||||
const allPages = [...staticPages, ...sujetPages];
|
||||
|
||||
const xml = `<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
${allPages
|
||||
.map(
|
||||
(url) => `
|
||||
<url>
|
||||
<loc>${baseUrl}${url}</loc>
|
||||
</url>`
|
||||
)
|
||||
.join('')}
|
||||
</urlset>`;
|
||||
|
||||
return new NextResponse(xml, {
|
||||
headers: {
|
||||
'Content-Type': 'application/xml',
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,40 @@
|
||||
import Head from 'next/head';
|
||||
|
||||
export type SEOProps = {
|
||||
title: string;
|
||||
description: string;
|
||||
image?: string;
|
||||
url?: string;
|
||||
type?: string;
|
||||
publishedTime?: string;
|
||||
updatedTime?: string;
|
||||
author?: string;
|
||||
};
|
||||
|
||||
export default function SEO({
|
||||
title,
|
||||
description,
|
||||
image = '',
|
||||
url = '',
|
||||
type = 'article',
|
||||
publishedTime,
|
||||
updatedTime,
|
||||
author,
|
||||
}: SEOProps) {
|
||||
return (
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
<meta name="description" content={description} />
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
{image && <meta property="og:image" content={image} />}
|
||||
{url && <meta property="og:url" content={url} />}
|
||||
<meta property="og:type" content={type} />
|
||||
{publishedTime && <meta property="article:published_time" content={publishedTime} />}
|
||||
{updatedTime && <meta property="article:modified_time" content={updatedTime} />}
|
||||
{author && <meta property="article:author" content={author} />}
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
{image && <meta name="twitter:image" content={image} />}
|
||||
</Head>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,256 @@
|
||||
[
|
||||
{
|
||||
"slug": "intelligence-artificielle-revolution-enjeux",
|
||||
"title": "L’Intelligence Artificielle : Révolution Technologique, Enjeux, Usages et Avenir",
|
||||
"description": "Guide complet sur l’intelligence artificielle : définition, fonctionnement, applications concrètes, avantages, risques, enjeux éthiques et impact sur l’avenir de la société.",
|
||||
"image1": {
|
||||
"src": "/images/ia-robot-main.webp",
|
||||
"alt": "Robot humanoïde et intelligence artificielle symbolisant la révolution technologique"
|
||||
},
|
||||
"sections": [
|
||||
{
|
||||
"h2": "Qu’est-ce que l’intelligence artificielle ?",
|
||||
"content": "L’intelligence artificielle, souvent abrégée IA, désigne l’ensemble des technologies capables de simuler des comportements humains tels que l’apprentissage, le raisonnement, la perception ou la prise de décision. Elle repose sur des algorithmes, des modèles mathématiques et de grandes quantités de données. Contrairement aux programmes classiques, l’IA peut évoluer, s’adapter et améliorer ses performances au fil du temps."
|
||||
},
|
||||
{
|
||||
"h2": "Comment fonctionne l’intelligence artificielle",
|
||||
"content": "Le fonctionnement de l’IA repose principalement sur le machine learning et le deep learning. Les algorithmes analysent d’immenses volumes de données afin d’identifier des motifs et de produire des prédictions ou des décisions. Les réseaux de neurones artificiels, inspirés du cerveau humain, sont au cœur des systèmes les plus avancés, notamment pour la reconnaissance d’images, la compréhension du langage ou la génération de contenus."
|
||||
},
|
||||
{
|
||||
"h2": "Les grandes catégories d’intelligence artificielle",
|
||||
"content": "On distingue généralement l’IA faible, conçue pour accomplir une tâche spécifique comme un assistant vocal, et l’IA forte, encore théorique, qui serait capable de raisonner comme un être humain. Aujourd’hui, la majorité des applications reposent sur une IA spécialisée, extrêmement performante dans un domaine précis mais limitée hors de son cadre."
|
||||
},
|
||||
{
|
||||
"h2": "Applications concrètes de l’intelligence artificielle",
|
||||
"content": "L’intelligence artificielle est déjà omniprésente dans notre quotidien. Elle alimente les moteurs de recommandation des plateformes de streaming, améliore la navigation GPS, optimise les résultats des moteurs de recherche et permet la reconnaissance faciale. Dans le secteur médical, elle aide au diagnostic, à l’analyse d’images médicales et à la recherche de nouveaux traitements. Dans l’industrie, elle optimise la production, la maintenance et la logistique."
|
||||
},
|
||||
{
|
||||
"h2": "L’intelligence artificielle dans le monde du travail",
|
||||
"content": "L’IA transforme profondément le marché de l’emploi. Certaines tâches répétitives sont automatisées, tandis que de nouveaux métiers émergent, notamment dans la data, le développement et l’analyse des systèmes intelligents. L’enjeu principal réside dans l’adaptation des compétences et la formation continue afin d’accompagner cette transformation technologique."
|
||||
},
|
||||
{
|
||||
"h2": "Avantages et opportunités de l’intelligence artificielle",
|
||||
"content": "L’intelligence artificielle permet des gains de productivité considérables, une réduction des erreurs humaines et une meilleure prise de décision grâce à l’analyse de données complexes. Elle ouvre également la voie à des innovations majeures dans la recherche scientifique, la médecine personnalisée, la transition énergétique et l’éducation."
|
||||
},
|
||||
{
|
||||
"h2": "Limites et risques de l’intelligence artificielle",
|
||||
"content": "Malgré ses avantages, l’IA présente des limites importantes. Les biais présents dans les données peuvent conduire à des décisions injustes ou discriminatoires. La dépendance excessive aux systèmes automatisés pose des questions de fiabilité et de responsabilité. La sécurité des données et la protection de la vie privée sont également des enjeux majeurs."
|
||||
},
|
||||
{
|
||||
"h2": "Enjeux éthiques et sociétaux de l’IA",
|
||||
"content": "Le développement de l’intelligence artificielle soulève de nombreuses questions éthiques. Qui est responsable en cas d’erreur d’un système autonome ? Comment garantir la transparence des algorithmes ? L’utilisation de l’IA dans la surveillance, la reconnaissance faciale ou les décisions judiciaires nécessite un encadrement strict pour préserver les libertés individuelles."
|
||||
},
|
||||
{
|
||||
"h2": "Intelligence artificielle et créativité",
|
||||
"content": "L’IA est désormais capable de générer des images, de la musique, des textes et même des vidéos. Cette capacité remet en question la notion de créativité et soulève des débats sur le droit d’auteur, la propriété intellectuelle et la place de l’humain dans les processus créatifs."
|
||||
},
|
||||
{
|
||||
"h2": "L’avenir de l’intelligence artificielle",
|
||||
"content": "L’avenir de l’IA s’annonce riche en évolutions. Les recherches portent sur des systèmes plus transparents, plus économes en énergie et mieux alignés avec les valeurs humaines. L’intelligence artificielle pourrait jouer un rôle clé dans la résolution de grands défis mondiaux, comme le changement climatique, la santé globale et la gestion des ressources."
|
||||
},
|
||||
{
|
||||
"h2": "Faut-il avoir peur de l’intelligence artificielle ?",
|
||||
"content": "La peur de l’IA est souvent alimentée par la méconnaissance et la science-fiction. En réalité, l’enjeu n’est pas de craindre la technologie, mais de l’encadrer intelligemment. Une réglementation adaptée, une éducation numérique renforcée et une utilisation responsable permettent de tirer le meilleur parti de l’intelligence artificielle."
|
||||
},
|
||||
{
|
||||
"h2": "FAQ – Intelligence artificielle",
|
||||
"content": "L’intelligence artificielle va-t-elle remplacer les humains ? Elle remplacera certaines tâches, mais créera aussi de nouvelles opportunités. L’IA est-elle dangereuse ? Elle peut l’être si elle est mal utilisée, d’où l’importance de règles claires. Peut-on faire confiance à l’IA ? La confiance dépend de la transparence, de la qualité des données et du contrôle humain."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"slug": "voyage-japon",
|
||||
"title": "Voyager au Japon : Guide Complet 2026, Itinéraires, Budget, Culture et Conseils",
|
||||
"description": "Guide ultime pour voyager au Japon : itinéraires détaillés, budget, transports, culture, gastronomie, saisons, conseils pratiques et erreurs à éviter pour un séjour réussi.",
|
||||
"image1": {
|
||||
"src": "/images/japon-tokyo.webp",
|
||||
"alt": "Vue panoramique de Tokyo avec le Mont Fuji au coucher du soleil"
|
||||
},
|
||||
"image2": {
|
||||
"src": "/images/japon-temple.webp",
|
||||
"alt": "Temple japonais traditionnel entouré de cerisiers en fleurs au printemps"
|
||||
},
|
||||
"sections": [
|
||||
{
|
||||
"h2": "Pourquoi voyager au Japon est une expérience unique",
|
||||
"content": "Voyager au Japon, c’est découvrir un pays où le respect, l’harmonie et l’innovation coexistent parfaitement. Le Japon séduit par son incroyable diversité : métropoles ultra-modernes, villages traditionnels, montagnes sacrées, plages tropicales et campagnes paisibles. La propreté, la sécurité et l’efficacité des transports rendent le voyage simple, même pour un premier séjour en Asie. Chaque détail du quotidien reflète une culture profondément ancrée dans les traditions, tout en étant tournée vers l’avenir."
|
||||
},
|
||||
{
|
||||
"h2": "Les grandes villes incontournables du Japon",
|
||||
"h3": "Tokyo, Kyoto, Osaka, Hiroshima et Nagoya",
|
||||
"content": "Tokyo est une mégalopole fascinante composée de quartiers aux identités très marquées : Shinjuku et ses gratte-ciel, Shibuya et son célèbre carrefour, Akihabara pour la culture geek, Asakusa pour le Japon traditionnel. Kyoto est le cœur historique du pays avec ses temples, ses sanctuaires shinto et ses jardins zen. Osaka est réputée pour sa gastronomie, son château et son ambiance conviviale. Hiroshima offre une visite chargée d’émotion avec le Parc du Mémorial de la Paix. Nagoya est une ville dynamique souvent sous-estimée, idéale pour découvrir un Japon plus local."
|
||||
},
|
||||
{
|
||||
"h2": "Découvrir le Japon hors des sentiers battus",
|
||||
"content": "Au-delà des grandes villes, le Japon regorge de régions méconnues mais exceptionnelles. Les Alpes japonaises offrent des paysages montagneux spectaculaires et des villages traditionnels comme Shirakawa-go. L’île de Kyushu est réputée pour ses volcans actifs et ses sources chaudes naturelles. Hokkaido séduit par sa nature sauvage et ses hivers enneigés. Okinawa propose une ambiance totalement différente avec ses plages paradisiaques et sa culture unique."
|
||||
},
|
||||
{
|
||||
"h2": "Quand partir au Japon ? Climat et saisons",
|
||||
"content": "Le Japon se visite toute l’année, mais chaque saison offre une expérience différente. Le printemps est très populaire grâce à la floraison des cerisiers, un événement culturel majeur. L’été est animé par de nombreux festivals traditionnels, bien que la chaleur et l’humidité puissent être élevées. L’automne est idéal pour les randonnées et les paysages colorés. L’hiver est parfait pour le ski, les onsen et les paysages enneigés, notamment dans le nord du pays."
|
||||
},
|
||||
{
|
||||
"h2": "Itinéraires recommandés pour un premier voyage au Japon",
|
||||
"content": "Pour un premier séjour de 10 à 14 jours, un itinéraire classique inclut Tokyo, Kyoto et Osaka. Il est possible d’ajouter Hiroshima ou Nara pour enrichir l’expérience. Pour un voyage plus long, intégrer Hokkaido ou Kyushu permet de découvrir une autre facette du Japon. Les voyageurs expérimentés pourront privilégier des itinéraires plus ruraux, axés sur la nature et la culture locale."
|
||||
},
|
||||
{
|
||||
"h2": "Budget voyage au Japon : combien ça coûte ?",
|
||||
"content": "Contrairement aux idées reçues, le Japon n’est pas forcément une destination hors de prix. Les repas peuvent coûter entre 7 et 15 € dans des restaurants locaux. Les transports sont très efficaces mais représentent un poste important du budget. Le JR Pass est souvent rentable pour les longs trajets. Les hébergements vont des auberges économiques aux ryokans traditionnels plus coûteux, offrant une expérience culturelle unique."
|
||||
},
|
||||
{
|
||||
"h2": "Se déplacer au Japon : trains, métro et pass",
|
||||
"content": "Le réseau ferroviaire japonais est reconnu comme l’un des meilleurs au monde. Les trains à grande vitesse Shinkansen relient rapidement les principales villes. Les cartes IC comme Suica ou Pasmo facilitent les déplacements urbains. La ponctualité et la clarté des indications rendent les déplacements simples, même sans parler japonais."
|
||||
},
|
||||
{
|
||||
"h2": "Hébergements au Japon : où dormir ?",
|
||||
"content": "Le Japon propose une grande variété d’hébergements. Les hôtels classiques offrent un confort standard, tandis que les hôtels capsules sont une expérience insolite et économique. Les ryokans permettent de dormir sur des tatamis et de goûter à la cuisine traditionnelle. Les logements chez l’habitant et les auberges de jeunesse sont idéaux pour les budgets serrés."
|
||||
},
|
||||
{
|
||||
"h2": "Culture japonaise et règles de savoir-vivre",
|
||||
"content": "Le respect des règles sociales est fondamental au Japon. Il est important d’enlever ses chaussures à l’intérieur, d’éviter de parler fort dans les transports et de respecter les files d’attente. Les Japonais apprécient les efforts des visiteurs pour comprendre leur culture, même de manière basique."
|
||||
},
|
||||
{
|
||||
"h2": "Gastronomie japonaise : bien plus que des sushis",
|
||||
"content": "La cuisine japonaise est variée et régionale. Les ramen diffèrent selon les villes, les okonomiyaki sont populaires à Osaka et Hiroshima, et les bentos offrent des repas complets à petit prix. La qualité des ingrédients est exceptionnelle, même dans les restaurants les plus simples."
|
||||
},
|
||||
{
|
||||
"h2": "Conseils pratiques avant de partir au Japon",
|
||||
"content": "Avant de partir, il est recommandé de vérifier les formalités d’entrée, de souscrire une assurance voyage et de prévoir un adaptateur électrique. Avoir un peu d’argent liquide est essentiel, car certains commerces n’acceptent pas les cartes bancaires. Une connexion internet via une carte SIM ou un pocket Wi-Fi facilite grandement le séjour."
|
||||
},
|
||||
{
|
||||
"h2": "Erreurs à éviter lors d’un voyage au Japon",
|
||||
"content": "Parmi les erreurs fréquentes : sous-estimer les distances, vouloir trop en faire en peu de temps, négliger les règles de politesse ou voyager sans planification minimale. Prendre le temps de découvrir chaque lieu rend le voyage bien plus agréable."
|
||||
},
|
||||
{
|
||||
"h2": "FAQ – Tout savoir avant de voyager au Japon",
|
||||
"content": "Le Japon est-il sûr pour les voyageurs ? Oui, c’est l’un des pays les plus sûrs au monde. Faut-il parler japonais ? Ce n’est pas obligatoire, mais apprendre quelques mots est apprécié. Peut-on voyager seul au Japon ? Absolument, le pays est idéal pour les voyageurs en solo."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"slug": "energie-renouvelable",
|
||||
"title": "Énergies Renouvelables : Définition, Types, Avantages, Défis et Avenir de la Transition Énergétique",
|
||||
"description": "Guide complet sur les énergies renouvelables : définition, types, avantages environnementaux et économiques, défis technologiques et rôle clé dans la transition énergétique mondiale.",
|
||||
"image1": {
|
||||
"src": "/images/energie-eolienne.webp",
|
||||
"alt": "Parc éolien produisant de l’énergie renouvelable respectueuse de l’environnement"
|
||||
},
|
||||
"image2": {
|
||||
"src": "/images/energie-solaire.webp",
|
||||
"alt": "Panneaux solaires photovoltaïques produisant de l’électricité verte"
|
||||
},
|
||||
"sections": [
|
||||
{
|
||||
"h2": "Qu’est-ce qu’une énergie renouvelable ?",
|
||||
"content": "Les énergies renouvelables sont des sources d’énergie issues de phénomènes naturels capables de se reconstituer rapidement à l’échelle humaine. Contrairement aux énergies fossiles comme le pétrole, le charbon ou le gaz, elles ne s’épuisent pas et génèrent peu ou pas d’émissions de gaz à effet de serre. Elles constituent un pilier essentiel de la transition énergétique et de la lutte contre le changement climatique."
|
||||
},
|
||||
{
|
||||
"h2": "Pourquoi les énergies renouvelables sont essentielles aujourd’hui",
|
||||
"content": "Face au réchauffement climatique, à la raréfaction des ressources fossiles et à la dépendance énergétique, les énergies renouvelables apparaissent comme une solution durable. Elles permettent de produire de l’électricité, de la chaleur et des carburants tout en limitant l’impact environnemental. Leur développement est devenu une priorité stratégique pour de nombreux pays."
|
||||
},
|
||||
{
|
||||
"h2": "Les principaux types d’énergies renouvelables",
|
||||
"content": "Les énergies renouvelables se déclinent en plusieurs catégories. L’énergie solaire exploite le rayonnement du soleil via des panneaux photovoltaïques ou thermiques. L’énergie éolienne utilise la force du vent pour produire de l’électricité. L’énergie hydraulique repose sur la puissance de l’eau, notamment grâce aux barrages. La biomasse transforme des matières organiques en énergie. La géothermie exploite la chaleur naturelle du sous-sol terrestre."
|
||||
},
|
||||
{
|
||||
"h2": "L’énergie solaire : une ressource abondante",
|
||||
"content": "L’énergie solaire est l’une des sources les plus prometteuses. Elle est disponible partout sur la planète et peut être exploitée à petite ou grande échelle. Les coûts des panneaux solaires ont fortement diminué ces dernières années, rendant cette technologie de plus en plus accessible aux particuliers comme aux entreprises."
|
||||
},
|
||||
{
|
||||
"h2": "L’énergie éolienne : produire grâce au vent",
|
||||
"content": "L’énergie éolienne est aujourd’hui l’une des principales sources d’électricité renouvelable. Les éoliennes terrestres et offshore permettent de produire de grandes quantités d’énergie. Leur intégration dans les paysages et leur acceptabilité sociale restent toutefois des enjeux importants."
|
||||
},
|
||||
{
|
||||
"h2": "L’énergie hydraulique : une technologie mature",
|
||||
"content": "L’hydroélectricité est la plus ancienne des énergies renouvelables modernes. Elle offre une production stable et pilotable, capable de répondre aux pics de demande. Cependant, la construction de barrages peut avoir des impacts écologiques importants, nécessitant une gestion responsable."
|
||||
},
|
||||
{
|
||||
"h2": "La biomasse et la géothermie",
|
||||
"content": "La biomasse permet de valoriser les déchets organiques pour produire de l’énergie, contribuant ainsi à l’économie circulaire. La géothermie exploite la chaleur interne de la Terre pour le chauffage et la production d’électricité. Ces deux sources offrent un fort potentiel local et durable."
|
||||
},
|
||||
{
|
||||
"h2": "Avantages environnementaux des énergies renouvelables",
|
||||
"content": "Les énergies renouvelables réduisent considérablement les émissions de CO2 et la pollution atmosphérique. Elles limitent l’impact sur les écosystèmes à long terme et contribuent à préserver les ressources naturelles. Leur utilisation est essentielle pour atteindre les objectifs climatiques internationaux."
|
||||
},
|
||||
{
|
||||
"h2": "Avantages économiques et sociaux",
|
||||
"content": "Le développement des énergies renouvelables crée de nombreux emplois locaux dans la construction, la maintenance et la recherche. Il renforce l’indépendance énergétique des pays et stabilise les coûts de l’énergie sur le long terme. Pour les consommateurs, elles représentent une opportunité de réduire les factures énergétiques."
|
||||
},
|
||||
{
|
||||
"h2": "Les défis des énergies renouvelables",
|
||||
"content": "Malgré leurs avantages, les énergies renouvelables font face à plusieurs défis. L’intermittence de certaines sources, comme le solaire et l’éolien, nécessite des solutions de stockage efficaces. Les infrastructures doivent être modernisées pour intégrer ces nouvelles productions. L’acceptation sociale et l’impact environnemental local doivent également être pris en compte."
|
||||
},
|
||||
{
|
||||
"h2": "Le rôle du stockage de l’énergie",
|
||||
"content": "Le stockage de l’énergie est un élément clé de la transition énergétique. Batteries, stations de pompage hydraulique et hydrogène vert permettent de stocker l’énergie produite en excès et de la restituer en période de forte demande. Les progrès technologiques dans ce domaine sont déterminants pour l’avenir."
|
||||
},
|
||||
{
|
||||
"h2": "Avenir des énergies renouvelables",
|
||||
"content": "L’avenir des énergies renouvelables est prometteur. Les innovations technologiques, la baisse des coûts et les politiques publiques favorables accélèrent leur déploiement. À long terme, elles pourraient devenir la principale source d’énergie mondiale et transformer profondément nos modes de production et de consommation."
|
||||
},
|
||||
{
|
||||
"h2": "FAQ – Énergies renouvelables",
|
||||
"content": "Les énergies renouvelables peuvent-elles remplacer les énergies fossiles ? À terme, oui, avec un mix énergétique adapté. Sont-elles vraiment écologiques ? Leur impact est bien inférieur aux énergies fossiles. Peut-on produire sa propre énergie ? Oui, notamment grâce au solaire et à l’éolien domestique."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"slug": "cryptomonnaies-avenir",
|
||||
"title": "Cryptomonnaies : Révolution, Risques, Applications et Futur de la Finance",
|
||||
"description": "Analyse complète et approfondie des cryptomonnaies : définition, fonctionnement, avantages, risques, adoption mondiale, régulation, impact sur l’économie et la société, et perspectives futures.",
|
||||
"image1": { "src": "/images/crypto-bitcoin.webp", "alt": "Pièce de Bitcoin sur fond numérique représentant les cryptomonnaies" },
|
||||
"image2": { "src": "/images/crypto-blockchain.webp", "alt": "Chaîne de blocs blockchain stylisée symbolisant la technologie des cryptomonnaies" },
|
||||
"sections": [
|
||||
{
|
||||
"h2": "Qu’est-ce qu’une cryptomonnaie ?",
|
||||
"content": "Une cryptomonnaie est une monnaie numérique décentralisée utilisant la technologie blockchain pour sécuriser et authentifier les transactions. Contrairement aux monnaies traditionnelles, elles ne dépendent pas d’une banque centrale. Chaque transaction est validée par un réseau d’ordinateurs (nodes), assurant transparence et sécurité. Les cryptomonnaies permettent d’effectuer des paiements rapides, de transférer des fonds à l’international sans intermédiaire et d’investir dans des actifs numériques innovants."
|
||||
},
|
||||
{
|
||||
"h2": "Comment fonctionne la blockchain ?",
|
||||
"content": "La blockchain est un registre public distribué et immuable qui enregistre toutes les transactions effectuées avec une cryptomonnaie. Chaque bloc contient un ensemble de transactions et un hash unique qui le relie au bloc précédent. Ce mécanisme garantit que les données ne peuvent pas être modifiées rétroactivement. Les blockchains peuvent être publiques (Bitcoin, Ethereum) ou privées (entreprises, banques). La blockchain est également utilisée pour les smart contracts, la finance décentralisée (DeFi) et les NFT."
|
||||
},
|
||||
{
|
||||
"h2": "Les principales cryptomonnaies et leurs spécificités",
|
||||
"content": "Il existe des milliers de cryptomonnaies, mais certaines se démarquent :\n- **Bitcoin (BTC)** : première crypto, réserve de valeur numérique, forte sécurité.\n- **Ethereum (ETH)** : plateforme pour smart contracts et applications décentralisées.\n- **Cardano (ADA)** : approche scientifique et sécurité élevée.\n- **Solana (SOL)** : rapidité et faible coût de transaction.\n- **Stablecoins (USDT, USDC)** : cryptos indexées sur des monnaies fiduciaires, moins volatiles.\n- **Altcoins** : cryptos alternatives spécialisées (DeFi, gaming, NFT)."
|
||||
},
|
||||
{
|
||||
"h2": "Avantages des cryptomonnaies",
|
||||
"h3": "Liberté financière, rapidité, innovation",
|
||||
"content": "Les cryptomonnaies offrent :\n- **Autonomie** : possibilité de gérer ses fonds sans banque.\n- **Transactions rapides** : surtout pour les transferts internationaux.\n- **Accessibilité** : ouvertes à tous avec Internet.\n- **Transparence** : chaque transaction est visible sur la blockchain.\n- **Innovation financière** : DeFi, staking, yield farming, smart contracts, NFT."
|
||||
},
|
||||
{
|
||||
"h2": "Risques et limites",
|
||||
"h3": "Volatilité, sécurité et régulation",
|
||||
"content": "Malgré leurs avantages, les cryptomonnaies présentent des risques :\n- **Volatilité extrême** : certains actifs peuvent perdre 50% de leur valeur en quelques jours.\n- **Sécurité** : les erreurs humaines ou le phishing peuvent provoquer des pertes.\n- **Régulation incertaine** : interdictions ou limitations possibles selon les pays.\n- **Fraudes et scams** : ICO frauduleuses, rug pulls, faux wallets.\n- **Impact environnemental** : certaines cryptos consomment beaucoup d’énergie (Proof of Work)."
|
||||
},
|
||||
{
|
||||
"h2": "Comment sécuriser ses cryptomonnaies",
|
||||
"content": "Pour réduire les risques :\n- **Wallets sécurisés** : hardware wallets (Ledger, Trezor) ou software wallets fiables.\n- **Authentification à deux facteurs** : sur plateformes d’échange.\n- **Ne jamais partager ses clés privées**.\n- **Diversifier ses investissements**.\n- **S’informer avant d’investir** sur chaque projet ou token."
|
||||
},
|
||||
{
|
||||
"h2": "Applications concrètes des cryptomonnaies",
|
||||
"content": "Les cryptomonnaies ne servent pas qu’à spéculer :\n- **Paiements** : achats en ligne, transferts internationaux.\n- **Finance décentralisée (DeFi)** : prêts, emprunts et rendements sans banques.\n- **NFT et gaming** : création, vente et échange d’actifs numériques.\n- **Supply chain et traçabilité** : suivi transparent de produits.\n- **Dons et crowdfunding** : financements globaux sans intermédiaires."
|
||||
},
|
||||
{
|
||||
"h2": "Adoption mondiale et régulation",
|
||||
"content": "L’adoption des cryptomonnaies varie selon les pays :\n- **Pays favorables** : El Salvador (BTC légal), Suisse, Singapour.\n- **Pays prudents** : Union Européenne, États-Unis (régulation en cours).\n- **Pays hostiles** : Chine (interdiction totale).\nLes régulations futures influenceront fortement la sécurité, la fiscalité et l’adoption globale."
|
||||
},
|
||||
{
|
||||
"h2": "Cryptomonnaies et économie",
|
||||
"content": "Les cryptos impactent plusieurs secteurs :\n- **Investissements** : nouveaux actifs numériques.\n- **Banques et finance** : adaptation des services financiers.\n- **Entreprises** : acceptation de paiements en cryptos.\n- **Gouvernements** : monnaies numériques de banque centrale (CBDC).\n- **Innovation technologique** : blockchain appliquée aux contrats, assurances et identité numérique."
|
||||
},
|
||||
{
|
||||
"h2": "Perspectives et futur",
|
||||
"content": "Le futur des cryptomonnaies dépendra de :\n- **Innovation technologique** : Proof of Stake, réduction consommation énergétique.\n- **Adoption grand public** : interfaces simples et sécurisées.\n- **Régulation équilibrée** : sécurité + innovation.\n- **Intégration avec l’économie traditionnelle** : banques, paiements, assurances.\n- **Cas d’usage réels** : supply chain, santé, identité, IoT."
|
||||
},
|
||||
{
|
||||
"h2": "Investir dans les cryptomonnaies",
|
||||
"content": "Conseils pour investir intelligemment :\n- Commencer par de petites sommes.\n- Étudier le projet, la communauté et la technologie.\n- Diversifier entre BTC, ETH, altcoins.\n- Ne jamais investir l’argent dont on a besoin.\n- Se former continuellement sur le marché et les tendances."
|
||||
},
|
||||
{
|
||||
"h2": "FAQ – Cryptomonnaies",
|
||||
"content": "Peut-on perdre tout son argent ? Oui, le risque est élevé.\nFaut-il être expert en informatique ? Non, mais comprendre les bases et sécuriser ses wallets est crucial.\nLes cryptos remplaceront-elles les monnaies traditionnelles ? Probablement pas à court terme, mais elles coexisteront comme alternative.\nQuelle crypto acheter ? Bitcoin reste la référence, Ethereum et certains altcoins présentent de l’innovation.\nPeut-on utiliser les cryptos pour les paiements quotidiens ? Oui, de plus en plus de commerçants et services acceptent BTC et stablecoins."
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
]
|
||||
Reference in New Issue
Block a user