/list
- - Use the username created in Tutorial 3
-
-Demonstration
+
+**Writing CSS in blogs.css**
+
+ ul.number {
+ list-style-type:upper-roman;
+ }
+
+
+Demonstration:
-----------------------
+ - Visit http://localhost:8000/blogs/get_blogs/
+
+ - In output, we will see Roman Letters before a blog
-*Note to Narrator: Demonstrate the new view in the browser to the viewer*
-Slide 9
+Demonstration:
-----------------------
-**Add a view to Display Articles**
+**Create welcome.js in static/blog/ and add the below code**
+
+ function greet() {
+ alert("Welcome to the blog app!");
+ }
-- Modify the blog/views.py and add a new view to display a list of all the articles of a blog
+**Modify blogs.html template as below**
- def article(request, article_id):
- articles = Article.objects.get(id=article_id)
- context = {'article': article}
- return render(request, 'blog/article.html', context)
+
+
-Slide 10a:
+Demonstration:
---------------------
-**Create a new template to display articles**
-
-- Create a template ```article.html``` at ```/blog/templates/blog/article.html``` to look like below
-
- {% if article %}
- {{ article.blog.name }}
- Article Title: {{ article.title}}
- Created: {{ article.created_on }}
-
- {{ article.body}}
-
- {% else %}
- No Articles are available for this blog.
- {% endif %}
-
-Slide 10b:
--------------------
-
-**Modify the blog template**
-
-- We need to add a link to each article in the blog list page ```/blog/templates/blog/blogs.html``` so that a user can view an articles
-
- {% if blogs %}
-
- {% for blog in blogs %}
- - {{ blog.name}}
-
- {% for article in blog.article_set %}
- - {{ article.title }}
/* Change this line here */
- {% endfor %}
-
- {% endfor %}
-
- {% else %}
- No Blogs are available.
- {% endif %}
-
-Slide 11
--------------------------
-
-**Add URLs for articles_list**
-
-- We need to add a new URL in ```/blogs/urls.py``` which will point to the articles_list view.
-- When selecting a particular blog the URL should look like ```localhost:8000/blog//articles```
- - The URLs should be well designed so that the application is readable and easy to debug
- - The views requires information such as the blog ID which needs to be passed using the URL
- - This is called a GET request
-
-- Modify the urls located in ```blog``` folder
-
- # /blogs/urls.py
- from django.conf.urls import patterns, url
- from blog import urls
-
- urlpatterns = [
- url(r'^(?P\w+)/list/$', views.get_blogs, name='blogs')
- url(r'^article/(?P[0-9]+)$', views.article, name='article')
- ]
-
-Slide 12
------------------------
+**Show Output**
-**Test the new view**
+ - Visit http://localhost:8000/blogs/get_blogs/
+ - Refresh the page
-- Activate the virtual environment
-- Run the Django test server using the command *python manage.py runserver*
-- Open the web browser and go to http://127.0.0.1:8000/blog//list
- - Use the username created in Tutorial 3
-- Now click on any one of the articles;
- - You will be redirected to the new view and template that you just created.
-
-Demonstration
------------------------
+ Output
+
+ - We will see the alert dialog popped up!
+
+For script writer: Can create two folders as css and js to separate out css and js files in a directory.
+Also showing an image can be shown here if time permits or else can be give as a slide or an assignment
-*Note to Narrator: Demonstrate the new view in the browser to the viewer*
+**Concluding Slides**
--
cgit