Ajout des fonctionnalités de blog : modèles, migrations, vues, templates, contexte et styles.

blog/admin.py

@@ -4,6 +4,5 @@ from .models import Post
 @admin.register(Post)
 class PostAdmin(admin.ModelAdmin):
     list_display = ('name', 'tags', 'slug', 'created_at')
-    list_filter = ('created_at',)
     search_fields = ('name', 'tags')
     prepopulated_fields = {"slug": ("name",)}

blog/context_processor.py

@@ -0,0 +1,5 @@
+from .models import Post
+
+def posts_list(request):
+    posts = Post.objects.all()
+    return {'posts': posts}

blog/migrations/0002_post_enable.py

@@ -0,0 +1,18 @@
+# Generated by Django 6.0 on 2025-12-15 19:40
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('blog', '0001_initial'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='post',
+            name='enable',
+            field=models.BooleanField(default=True),
+        ),
+    ]

blog/models.py

@@ -7,6 +7,7 @@ class Post(models.Model):
     content = models.TextField()
     created_at = models.DateTimeField(auto_now_add=True)
     updated_at = models.DateTimeField(auto_now=True)
+    enable = models.BooleanField(default=True)
 
     class Meta:
         verbose_name = "Article"

blog/urls.py

@@ -4,5 +4,5 @@ from . import views
 app_name = 'blog'
 urlpatterns = [
     path('', views.blog_home, name='blog'),
-    path('<int:slug>/', views.blog_view_post, name='post_detail'),
+    path('<str:slug>/', views.blog_view_post, name='post_detail'),
 ]

blog/views.py

@@ -1,7 +1,11 @@
 from django.shortcuts import render
 
-def blog_home(request):
-    return ""
+from blog.models import Post
 
-def blog_view_post(request):
-    return ""
+
+def blog_home(request):
+    return render(request, 'blog/home.html')
+
+def blog_view_post(request, slug):
+    post = Post.objects.get(slug=slug)
+    return render(request, 'blog/details.html', {'post': post})

core/admin.py

@@ -23,4 +23,7 @@ class SiteSettingsAdmin(admin.ModelAdmin):
         ('Contact', {
             'fields': ('contact_email',)
         }),
+        ('Blog', {
+            'fields': ('blog_title', 'blog_description')
+        }),
     )

core/migrations/0002_sitesettings_blog_description_and_more.py

@@ -0,0 +1,23 @@
+# Generated by Django 6.0 on 2025-12-15 19:35
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0001_initial'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='sitesettings',
+            name='blog_description',
+            field=models.TextField(blank=True),
+        ),
+        migrations.AddField(
+            model_name='sitesettings',
+            name='blog_title',
+            field=models.CharField(default='Mon Blog', max_length=200),
+        ),
+    ]

core/migrations/0003_alter_sitesettings_blog_description_and_more.py

@@ -0,0 +1,23 @@
+# Generated by Django 6.0 on 2025-12-15 19:40
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0002_sitesettings_blog_description_and_more'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='sitesettings',
+            name='blog_description',
+            field=models.TextField(blank=True, default='Je documente la construction de PartirDeZero.com : mes choix techniques, mes bugs résolus et mes conseils pour lancer tes propres projets web. Apprends en regardant faire.'),
+        ),
+        migrations.AlterField(
+            model_name='sitesettings',
+            name='blog_title',
+            field=models.CharField(default='Blog du développeur', max_length=200),
+        ),
+    ]

core/models.py

@@ -13,6 +13,10 @@ class SiteSettings(models.Model):
     linkedin_url = models.URLField(blank=True)
     github_url = models.URLField(blank=True)
 
+    # Blog
+    blog_title = models.CharField(max_length=200, default="Blog du développeur")
+    blog_description = models.TextField(blank=True, default="Je documente la construction de PartirDeZero.com : mes choix techniques, mes bugs résolus et mes conseils pour lancer tes propres projets web. Apprends en regardant faire.")
+
     # L'astuce pour qu'il n'y ait qu'un seul réglage
     def save(self, *args, **kwargs):
         self.pk = 1  # On force l'ID à 1. Si tu sauvegardes, ça écrase l'existant.

devart/settings.py

@@ -83,6 +83,7 @@ TEMPLATES = [
                 'devart.context_processor.app_version',
                 'core.context_processor.site_settings',
                 'courses.context_processors.course_list',
+                'blog.context_processor.posts_list',
             ],
         },
     },

static/css/app.css

@@ -751,6 +751,100 @@ img {
     height: auto;
 }
 
+/* ======================================
+   Blog components
+   ====================================== */
+
+/* Accessibilité: élément visuellement masqué mais accessible aux lecteurs d'écran */
+.sr-only {
+    position: absolute !important;
+    width: 1px !important;
+    height: 1px !important;
+    padding: 0 !important;
+    margin: -1px !important;
+    overflow: hidden !important;
+    clip: rect(0,0,0,0) !important;
+    white-space: nowrap !important;
+    border: 0 !important;
+}
+
+/* Blog layout wrappers */
+.blog.blog-home .blog-header {
+    display: grid;
+    gap: var(--space-3);
+    margin-bottom: var(--space-6);
+}
+.blog-title {
+    margin: 0;
+}
+.blog-description {
+    color: var(--text-muted);
+    font-size: 1.05rem;
+}
+
+/* Post list grid */
+.post-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+    gap: var(--space-5);
+}
+
+.post-card {
+    background: var(--surface);
+    border: 1px solid var(--border-subtle);
+    border-radius: var(--r-3);
+    box-shadow: var(--shadow-1);
+    padding: var(--space-5);
+    display: grid;
+    gap: var(--space-3);
+    transition: transform var(--transition-1), box-shadow var(--transition-1), border-color var(--transition-1);
+}
+.post-card:hover {
+    transform: translateY(-2px);
+    box-shadow: var(--shadow-2);
+    border-color: var(--border-strong);
+}
+.post-card-title {
+    margin: 0;
+}
+.post-card-title a { color: var(--fg); text-decoration: none; }
+.post-card-title a:hover { color: var(--link-hover); text-decoration: underline; }
+.post-excerpt { color: var(--text); opacity: 0.95; }
+.post-actions { margin-top: 2px; }
+
+/* Post meta (date, tags) */
+.post-meta { color: var(--text-muted); font-size: 0.95rem; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
+.post-meta i { color: var(--muted); margin-right: 6px; }
+.post-meta .sep { color: var(--muted); }
+
+/* Post detail */
+.post-detail .post-header { margin-bottom: var(--space-5); }
+.post-detail .post-title { margin-bottom: var(--space-2); }
+
+/* Prose content: typographic rhythm inside articles */
+.prose {
+    line-height: 1.75;
+    color: var(--text);
+}
+.prose :where(p, ul, ol, blockquote, pre, table, img) { margin: 0 0 var(--space-4); }
+.prose a { color: var(--link); }
+.prose a:hover { color: var(--link-hover); text-decoration: underline; }
+.prose blockquote {
+    margin-left: 0;
+    padding-left: var(--space-4);
+    border-left: 3px solid var(--border-strong);
+    color: var(--text-muted);
+    font-style: italic;
+}
+.prose code { font-family: var(--font-mono); background: var(--neutral-300); padding: 0 4px; border-radius: var(--r-1); }
+.prose pre {
+    background: var(--code-bg);
+    color: var(--code-text);
+    padding: var(--space-4);
+    border-radius: var(--r-2);
+    overflow: auto;
+}
+
 /* Make embedded media responsive */
 iframe, video { max-width: 100%; height: auto; }
 

templates/blog/details.html

@@ -0,0 +1,24 @@
+{% extends 'layout.html' %}
+{% block title %} | Blog : {{ post.name }}{% endblock %}
+{% block og_title %}Blog de Partir De Zéro : {{ post.name }}{% endblock %}
+{% block description %}{{ post.content|striptags|truncatewords:20 }}{% endblock %}
+{% block og_description %}{{ post.content|striptags|truncatewords:20 }}{% endblock %}
+
+{% block content %}
+    <section class="blog post-detail">
+        <header class="post-header">
+            <h1 class="post-title">{{ post.name }}</h1>
+            <div class="post-meta">
+                <span class="post-date"><i class="fa-regular fa-calendar"></i> {{ post.created_at|date:"d F Y" }}</span>
+                {% if post.tags %}
+                    <span class="sep">•</span>
+                    <span class="post-tags"><i class="fa-solid fa-tag"></i> {{ post.tags }}</span>
+                {% endif %}
+            </div>
+        </header>
+
+        <article class="post-content prose">
+            {{ post.content|safe }}
+        </article>
+    </section>
+{% endblock %}

templates/blog/home.html

@@ -0,0 +1,17 @@
+{% extends 'layout.html' %}
+{% block title %} | Blog{% endblock %}
+{% block og_title %}Blog de Partir De Zéro{% endblock %}
+{% block description %}{{ settings.blog_description }}{% endblock %}
+{% block og_description %}{{ settings.blog_description }}{% endblock %}
+
+{% block content %}
+    <section class="blog blog-home">
+        <header class="blog-header">
+            <h1 class="blog-title">{{ settings.blog_title|default:'Blog' }}</h1>
+            <p class="blog-description">{{ settings.blog_description }}</p>
+        </header>
+
+        <h2 class="sr-only">Liste des articles</h2>
+        {% include 'blog/partials/_posts_list.html' %}
+    </section>
+{% endblock %}

templates/blog/partials/_posts_list.html

@@ -0,0 +1,20 @@
+<div class="post-list">
+    {% for post in posts %}
+        <article class="post-card">
+            <h3 class="post-card-title"><a href="{% url 'blog:post_detail' post.slug %}">{{ post.name }}</a></h3>
+            <div class="post-meta">
+                <span class="post-date"><i class="fa-regular fa-calendar"></i> {{ post.created_at|date:"d F Y" }}</span>
+                {% if post.tags %}
+                    <span class="sep">•</span>
+                    <span class="post-tags"><i class="fa-solid fa-tag"></i> {{ post.tags }}</span>
+                {% endif %}
+            </div>
+            <p class="post-excerpt">{{ post.content|striptags|truncatewords:26 }}</p>
+            <div class="post-actions">
+                <a class="button button-secondary" href="{% url 'blog:post_detail' post.slug %}">Lire l'article →</a>
+            </div>
+        </article>
+    {% empty %}
+        <p>Aucun article pour le moment.</p>
+    {% endfor %}
+    </div>

templates/partials/_header.html

@@ -20,8 +20,8 @@
                     {% endfor %}
                 </ul>
             </li>
-            <!--<li><a href="">Tutoriels</a></li>
-            <li><a href="">Billets</a></li>-->
+            <!--<li><a href="">Tutoriels</a></li>-->
+            <li><a href="{% url 'blog:blog' %}">Blog</a></li>
         </ul>
         <div class="navend">
             <ul>