diff options
Diffstat (limited to 'files/es/learn/server-side/django/django_assessment_blog/index.html')
-rw-r--r-- | files/es/learn/server-side/django/django_assessment_blog/index.html | 307 |
1 files changed, 307 insertions, 0 deletions
diff --git a/files/es/learn/server-side/django/django_assessment_blog/index.html b/files/es/learn/server-side/django/django_assessment_blog/index.html new file mode 100644 index 0000000000..cb5ac7ad88 --- /dev/null +++ b/files/es/learn/server-side/django/django_assessment_blog/index.html @@ -0,0 +1,307 @@ +--- +title: 'Evaluación: DIY Django mini blog' +slug: Learn/Server-side/Django/django_assessment_blog +translation_of: Learn/Server-side/Django/django_assessment_blog +--- +<div>{{LearnSidebar}}</div> + +<div>{{PreviousMenu("Learn/Server-side/Django/web_application_security", "Learn/Server-side/Django")}}</div> + +<p class="summary">En esta evaluación usarás el conocimiento de Django que has adquirido en el módulo <a href="/es/docs/Learn/Server-side/Django" style="font-size: 1.25rem;">Framework Web Django (Python)</a> para crear un blog muy básico<span style="font-size: 1.25rem;">.</span></p> + +<table class="learn-box standard-table"> + <tbody> + <tr> + <th scope="row">Requisitos Previos:</th> + <td>Before attempting this assessment you should have already worked through all the articles in this module.</td> + </tr> + <tr> + <th scope="row">Objetivo:</th> + <td>Comprender los fundamentos de Django , incluidos las configuraciones de URL , modelos, vistas, formularios y templates.</td> + </tr> + </tbody> +</table> + +<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2> + +<p>Las paginas que necesitan ser mostradas, sus URLs, y otros requisitos son listados debajo: </p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Pagina</th> + <th scope="col">URL</th> + <th scope="col">Requisitos</th> + </tr> + </thead> + <tbody> + <tr> + <td>Home page</td> + <td><code>/</code> and <code>/blog/</code></td> + <td>Una pagina inicial que describa el sitio</td> + </tr> + <tr> + <td>Lista de todos las publicaciones del blog</td> + <td><code>/blog/blogs/</code></td> + <td> + <p>Lista de todos las publicaciones del blog:</p> + + <ul> + <li>Accessible to all users from a sidebar link.</li> + <li>List sorted by post date (newest to oldest).</li> + <li>List paginated in groups of 5 articles.</li> + <li>List items display the blog title, post date, and author.</li> + <li>Blog post names are linked to blog detail pages.</li> + <li>Blogger (author names) are linked to blog author detail pages.</li> + </ul> + </td> + </tr> + <tr> + <td>Blog autor (blogger) pagina de detalles</td> + <td><code>/blog/blogger/<em><author-id></em></code></td> + <td> + <p>Information for a specified author (by id) and list of their blog posts:</p> + + <ul> + <li>Accessible to all users from author links in blog posts etc.</li> + <li>Contains some biographical information about the blogger/author.</li> + <li>List sorted by post date (newest to oldest).</li> + <li>Not paginated.</li> + <li>List items display just the blog post name and post date.</li> + <li>Blog post names are linked to blog detail pages.</li> + </ul> + </td> + </tr> + <tr> + <td>Blog post detail page</td> + <td><code>/blog/<em><blog-id></em></code></td> + <td> + <p>Blog post details.</p> + + <ul> + <li>Accessible to all users from blog post lists.</li> + <li>Page contains the blog post: name, author, post date, and content.</li> + <li>Comments for the blog post should be displayed at bottom.</li> + <li>Comments should be sorted in order: oldest to most recent.</li> + <li>Contains link to add comments at end for logged in users (see Comment form page)</li> + <li>Blog posts and comments need only display plain text. There is no need to support any sort of HTML markup (e.g. links, images, bold/italic, etc).</li> + </ul> + </td> + </tr> + <tr> + <td>List of all bloggers</td> + <td><code>/blog/bloggers/</code></td> + <td> + <p>List of bloggers on system:</p> + + <ul> + <li>Accessible to all users from site sidebar</li> + <li>Blogger names are linked to Blog author detail pages.</li> + </ul> + </td> + </tr> + <tr> + <td>Comment form page</td> + <td><code>/blog/<em><blog-id></em>/create</code></td> + <td> + <p>Create comment for blog post:</p> + + <ul> + <li>Accessible to logged-in users (only) from link at bottom of blog post detail pages.</li> + <li>Displays form with description for entering comments (post date and blog is not editable).</li> + <li>After a comment has been posted, the page will redirect back to the associated blog post page.</li> + <li>Users cannot edit or delete their posts.</li> + <li>Logged out users will be directed to the login page to log in, before they can add comments. After logging in, they will be redirected back to the blog page they wanted to comment on.</li> + <li>Comment pages should include the name/link to the blogpost being commented on.</li> + </ul> + </td> + </tr> + <tr> + <td>User authentication pages</td> + <td><code>/accounts/<em><standard urls></em></code></td> + <td> + <p>Standard Django authentication pages for logging in, out and setting the password:</p> + + <ul> + <li>Login/out should be accessible via sidebar links.</li> + </ul> + </td> + </tr> + <tr> + <td>Admin site</td> + <td><code>/admin/<em><standard urls></em></code></td> + <td> + <p>Admin site should be enabled to allow create/edit/delete of blog posts, blog authors and blog comments (this is the mechanism for bloggers to create new blog posts):</p> + + <ul> + <li>Admin site blog posts records should display the list of associated comments inline (below each blog post).</li> + <li>Comment names in the Admin site are created by truncating the comment description to 75 characters.</li> + <li>Other types of records can use basic registration.</li> + </ul> + </td> + </tr> + </tbody> +</table> + +<p>In addition you should write some basic tests to verify:</p> + +<ul> + <li>All model fields have the correct label and length.</li> + <li>All models have the expected object name (e.g.<code> __str__()</code> returns the expected value).</li> + <li>Models have the expected URL for individual Blog and Comment records (e.g. <code>get_absolute_url()</code> returns the expected URL).</li> + <li>The BlogListView (all-blog page) is accessible at the expected location (e.g. /blog/blogs)</li> + <li>The BlogListView (all-blog page) is accessible at the expected named url (e.g. 'blogs')</li> + <li>The BlogListView (all-blog page) uses the expected template (e.g. the default)</li> + <li>The BlogListView paginates records by 5 (at least on the first page)</li> +</ul> + +<div class="note"> +<p><strong>Note</strong>: There are of course many other tests you can run. Use your discretion, but we'll expect you to do at least the tests above.</p> +</div> + +<p>The following section shows <a href="#Screenshots">screenshots</a> of a site that implements the requirements above.</p> + +<h2 id="Screenshots">Screenshots</h2> + +<p>The following screenshot provide an example of what the finished program should output.</p> + +<h3 id="List_of_all_blog_posts">List of all blog posts</h3> + +<p>This displays the list of all blog posts (accessible from the "All blogs" link in the sidebar). Things to note:</p> + +<ul> + <li>The sidebar also lists the logged in user.</li> + <li>Individual blog posts and bloggers are accessible as links in the page.</li> + <li>Pagination is enabled (in groups of 5)</li> + <li>Ordering is newest to oldest.</li> +</ul> + +<p><img alt="List of all blogs" src="https://mdn.mozillademos.org/files/14319/diyblog_allblogs.png" style="border-style: solid; border-width: 1px; display: block; height: 363px; margin: 0px auto; width: 986px;"></p> + +<h3 id="List_of_all_bloggers">List of all bloggers</h3> + +<p>This provides links to all bloggers, as linked from the "All bloggers" link in the sidebar. In this case we can see from the sidebar that no user is logged in.</p> + +<p><img alt="List of all bloggers" src="https://mdn.mozillademos.org/files/14321/diyblog_blog_allbloggers.png" style="border-style: solid; border-width: 1px; display: block; height: 256px; margin: 0px auto; width: 493px;"></p> + +<h3 id="Blog_detail_page">Blog detail page</h3> + +<p>This shows the detail page for a particular blog.</p> + +<p><img alt="Blog detail with add comment link" src="https://mdn.mozillademos.org/files/14323/diyblog_blog_detail_add_comment.png" style="border-style: solid; border-width: 1px; display: block; height: 640px; margin: 0px auto; width: 986px;"></p> + +<p>Note that the comments have a date <em>and</em> time, and are ordered from oldest to newest (opposite of blog ordering). At the end we have a link for accessing the form to add a new comment. If a user is not logged in we'd instead see a suggestion to log in.</p> + +<p><img alt="Comment link when not logged in" src="https://mdn.mozillademos.org/files/14325/diyblog_blog_detail_not_logged_in.png" style="border-style: solid; border-width: 1px; display: block; height: 129px; margin: 0px auto; width: 646px;"></p> + +<h3 id="Add_comment_form">Add comment form</h3> + +<p>This is the form to add comments. Note that we're logged in. When this succeeds we should be taken back to the associated blog post page.</p> + +<p><img alt="Add comment form" src="https://mdn.mozillademos.org/files/14329/diyblog_comment_form.png" style="border-style: solid; border-width: 1px; display: block; height: 385px; margin: 0px auto; width: 778px;"></p> + +<h3 id="Author_bio">Author bio</h3> + +<p>This displays bio information for a blogger along with their blog posts list.</p> + +<p><img alt="Blogger detail page" src="https://mdn.mozillademos.org/files/14327/diyblog_blogger_detail.png" style="border-style: solid; border-width: 1px; display: block; height: 379px; margin: 0px auto; width: 982px;"></p> + +<h2 id="Steps_to_complete">Steps to complete</h2> + +<p>The following sections describe what you need to do.</p> + +<ol> + <li>Create a skeleton project and web application for the site (as described in <a href="/en-US/docs/Learn/Server-side/Django/skeleton_website">Django Tutorial Part 2: Creating a skeleton website</a>). You might use 'diyblog' for the project name and 'blog' for the application name.</li> + <li>Create models for the Blog posts, Comments, and any other objects needed. When thinking about your design, remember: + <ul> + <li>Each comment will have only one blog, but a blog may have many comments.</li> + <li>Blog posts and comments must be sorted by post date.</li> + <li>Not every user will necessarily be a blog author though any user may be a commenter.</li> + <li>Blog authors must also include bio information.</li> + </ul> + </li> + <li>Run migrations for your new models and create a superuser.</li> + <li>Use the admin site to create some example blog posts and blog comments.</li> + <li>Create views, templates, and URL configurations for blog post and blogger list pages.</li> + <li>Create views, templates, and URL configurations for blog post and blogger detail pages.</li> + <li>Create a page with a form for adding new comments (remember to make this only available to logged in users!)</li> +</ol> + +<h2 id="Hints_and_tips">Hints and tips</h2> + +<p>This project is very similar to the <a href="/en-US/docs/Learn/Server-side/Django/Tutorial_local_library_website">LocalLibrary</a> tutorial. You will be able to set up the skeleton, user login/logout behaviour, support for static files, views, URLs, forms, base templates and admin site configuration using almost all the same approaches.</p> + +<p>Some general hints:</p> + +<ol> + <li>The index page can be implemented as a basic function view and template (just like for the locallibrary).</li> + <li>The list view for blog posts and bloggers, and the detail view for blog posts can be created using the <a href="/en-US/docs/Learn/Server-side/Django/Generic_views">generic list and detail views</a>.</li> + <li>The list of blog posts for a particular author can be created by using a generic list Blog list view and filtering for blog object that match the specified author. + <ul> + <li>You will have to implement <code>get_queryset(self)</code> to do the filtering (much like in our library class <code>LoanedBooksAllListView</code>) and get the author information from the URL.</li> + <li>You will also need to pass the name of the author to the page in the context. To do this in a class-based view you need to implement <code>get_context_data()</code> (discussed below).</li> + </ul> + </li> + <li>The <em>add comment</em> form can be created using a function-based view (and associated model and form) or using a generic <code>CreateView</code>. If you use a <code>CreateView</code> (recommended) then: + <ul> + <li>You will also need to pass the name of the blog post to the comment page in the context (implement <code>get_context_data()</code> as discussed below).</li> + <li>The form should only display the comment "description" for user entry (date and associated blog post should not be editable). Since they won't be in the form itself, your code will need to set the comment's author in the<code> form_valid()</code> function so it can be saved into the model (<a href="https://docs.djangoproject.com/en/1.10/topics/class-based-views/generic-editing/#models-and-request-user">as described here</a> — Django docs). In that same function we set the associated blog. A possible implementation is shown below (<code>pk</code> is a blog id passed in from the URL/URL configuration). + <pre class="brush: python"> def form_valid(self, form): + """ + Add author and associated blog to form data before setting it as valid (so it is saved to model) + """ + #Add logged-in user as author of comment + form.instance.author = self.request.user + #Associate comment with blog based on passed id + form.instance.blog=get_object_or_404(Blog, pk = self.kwargs['pk']) + # Call super-class form validation behaviour + return super(BlogCommentCreate, self).form_valid(form) +</pre> + </li> + <li>You will need to provide a success URL to redirect to after the form validates; this should be the original blog. To do this you will need to override <code>get_success_url()</code> and "reverse" the URL for the original blog. You can get the required blog ID using the <code>self.kwargs</code> attribute, as shown in the <code>form_valid()</code> method above.</li> + </ul> + </li> +</ol> + +<p>We briefly talked about passing a context to the template in a class-based view in the <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/Django/Generic_views#Overriding_methods_in_class-based_views">Django Tutorial Part 6: Generic list and detail views</a> topic. To do this you need to override <code>get_queryset()</code> (first getting the existing context, updating it with whatever additional variables you want to pass to the template, and then returning the updated context. For example, the code fragment below shows how you can add a blogger object to the context based on their <code>BlogAuthor</code> id.</p> + +<pre class="brush: python">class SomeView(generic.ListView): + ... + + def get_context_data(self, **kwargs): + # Call the base implementation first to get a context + context = super(SomeView, self).get_context_data(**kwargs) + # Get the blogger object from the "pk" URL parameter and add it to the context + context['blogger'] = get_object_or_404(BlogAuthor, pk = self.kwargs['pk']) + return context +</pre> + +<h2 id="Assessment">Assessment</h2> + +<p>The assessment for this task is <a href="https://github.com/mdn/django-diy-blog/blob/master/MarkingGuide.md">available on Github here</a>. This assessment is primarily based on how well your application meets the requirements we listed above, though there are some parts of the assessment that check your code uses appropriate models, and that you have written at least some test code. When you're done, you can check out our <a href="https://github.com/mdn/django-diy-blog">the finished example</a> which reflects a "full marks" project.</p> + +<p>Once you've completed this module you've also finished all the MDN content for learning basic Django server-side website programming! We hope you enjoyed this module and feel you have a good grasp of the basics!</p> + +<p>{{PreviousMenu("Learn/Server-side/Django/web_application_security", "Learn/Server-side/Django")}}</p> + +<p> </p> + +<h2 id="En_este_modulo">En este modulo</h2> + +<ul> + <li><a href="/es/docs/Learn/Server-side/Django/Introducción">Introducción a Django</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/development_environment">Configurando un entorno de desarrollo Django</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Tutorial_local_library_website">Tutorial de Django: El sito web de la Biblioteca Local</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/skeleton_website">Tutorial de Django Parte 2: Creando el esqueleto de un sitio web</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Models">Tutorial de Django Parte 3: Usando modelos</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Admin_site">Tutorial de Django Parte 4: Sitio de administración de Django</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Home_page">Tutorial de Django Parte 5: Creando nuestra página de inicio</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Generic_views">Tutorial de Django Parte 6: Listas genéricas y vistas de detalle</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Sessions">Tutorial de Django Parte 7: Framework de sesiones</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Authentication">Tutorial de Django Parte 8: Autenticación de usuarios y permisos</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Forms">Tutorial de Django Parte 9: Trabajando con formularios</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Testing">Tutorial de Django Parte 10: Probando una aplicación web de Django</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/Deployment">Tutorial de Django Parte 11: Poniendo Django en producción</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/web_application_security">Seguridad en aplicaciones web Django</a></li> + <li><a href="/es/docs/Learn/Server-side/Django/django_assessment_blog">DIY Django mini blog</a></li> +</ul> |