Python django web training——（三）我的第一个blog

来源：互联网发布：晾霸好太太知乎编辑：程序博客网时间：2024/05/20 16:35

在前一次，已经建立了名为mysite的django project。

建立完成后，结构如下：

这一次要在此基础上，建立一个名为blog的app。

新建app,选中mysite,点击鼠标右键，选择django->create application

输入名称：blog，点击OK完成

完成后如下图所示，已经有一个名为blog的folder了

修改代码

models.py

from django.db import modelsfrom django.contrib import admin  # Create your models here.  class BlogPost(models.Model):      title = models.CharField(max_length=150)      body = models.TextField()      timestamp = models.DateTimeField()    class BlogPostAdmin(admin.ModelAdmin):      list_display = ('title','body','timestamp')    admin.site.register(BlogPost,BlogPostAdmin)

views.py

from django.shortcuts import renderfrom django.template import loader,Context  from django.http import HttpResponse  from blog.models import BlogPost  # Create your views here.def archive(request):      posts = BlogPost.objects.all()      t = loader.get_template('archive.html')      c = Context({'posts':posts})      return HttpResponse(t.render(c))

settings.py

INSTALLED_APPS = (    'django.contrib.admin',    'django.contrib.auth',    'django.contrib.contenttypes',    'django.contrib.sessions',    'django.contrib.messages',    'django.contrib.staticfiles',    'blog',)

STATIC_URL = '/static/'

urls.py

from django.conf.urls import patterns, include, urlfrom django.contrib import adminadmin.autodiscover()from blog.views import*urlpatterns = patterns('',    # Examples:    # url(r'^$', 'mysite.views.home', name='home'),    # url(r'^blog/', include('blog.urls')),    url(r'^admin/', include(admin.site.urls)),    url(r'^blog/$',archive),)from django.contrib.staticfiles.urls import staticfiles_urlpatternsurlpatterns += staticfiles_urlpatterns()

建立网页模版

在模块blog下添加templates文件夹

base.html

<html>  <style type="text/css">   </style> <head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1">    <title>My blog</title>    <!-- Bootstrap -->    {% block bootstrapcss %}    <link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">     <link href="/static/starter-template.css" rel="stylesheet">    {% endblock %}    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->    <!--[if lt IE 9]>      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>    <![endif]-->  </head><body>      {% block container %}    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">      <div class="container">        <div class="navbar-header">          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">            <span class="sr-only">Toggle navigation</span>            <span class="icon-bar"></span>            <span class="icon-bar"></span>            <span class="icon-bar"></span>          </button>          <a class="navbar-brand" href="#">My blog</a>        </div>        <div class="navbar-collapse collapse"> <ul class="nav navbar-nav">            <li class="active"><a href="#">Home</a></li>            <li><a href="#about">About</a></li>            <li><a href="#contact">Contact</a></li>          </ul>          <form class="navbar-form navbar-right" role="form">            <div class="form-group">              <input type="text" placeholder="Email" class="form-control">            </div>            <div class="form-group">              <input type="password" placeholder="Password" class="form-control">            </div>            <button type="submit" class="btn btn-success">Sign in</button>          </form>        </div><!--/.navbar-collapse -->      </div>    </div>    <div class="jumbotron">      <div class="container">        <h1>Hello, world!</h1>            </div>    </div>     {% endblock %}    {% block jquery %}    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>    {% endblock %}  {% block bootstrapjs %}<!-- Include all compiled plugins (below), or include individual files as needed -->    <script src="/static/bootstrap/js/bootstrap.min.js"></script>  {% endblock %}  {% block content %}  {% endblock %}  </body>  </html>

archive.html

{% extends "base.html" %}  {% block content %}  {% for post in posts %}  <h1>{{ post.title}}</h1>  <p>{{ post.timestamp}}</p>  <p>{{ post.body }}</p>  {% endfor %}  {% endblock %}

下载bootstrap http://getbootstrap.com/2.3.2/

解压后放在项目的static文件夹中