diff --git a/7_Proyecto_Web_Completo.md b/7_Proyecto_Web_Completo.md new file mode 100644 index 0000000..1b4a192 --- /dev/null +++ b/7_Proyecto_Web_Completo.md @@ -0,0 +1,170 @@ +# Proyecto Web + +**Ejémplo estructura común página web** +``` ++-------------------------------------+ +| +------+ +-------------------+ | +| | Logo | | Menu | |<---- cont. estatico y dinamico +| +------+ +-------------------+ | +| +-------------------------------+ | +| | | | +| | | | +| | Zona de Carga | | +| | | | +| | de Contenido | |<---- cont. estatico y dinamico +| | | | +| | | | +| | | | +| +-------------------------------+ | +| +-------------------------------+ | +| | Pie de página | | <---- rrss, contacto +| +-------------------------------+ | ++-------------------------------------+ +``` +El contenido a mostar en la zona de carga dependerá +de lo seleccionado en menú o pie de página. + +- Crear URLs y Vistas +- Crear Plantillas y herencias +- Manejar archivos externos +- Conf. panel de administración +- Conf. conexión a BBDD +- CRUD con BBDD +- Trabajo con formularios y envío de mails +- Depsliege + + +## Inicio ProyectoWeb +``` +django-admin startproject ProyectoWeb + +cd ProyectoWeb + +python3 manage.py startapp ProyectoWebApp + +# configuar settings.py (TimeZone, idioma, ip , mail, bd...) + +python3 manage.py runserver 192.168.0.4:8000' +``` + +#### Menu: +- Home +- Servicios +- Tienda +- Blog +- Contacto +- *~~(admin)~~* + + +App/**views.py** +``` +from django.shortcuts import render, HttpResponse + +def home(request): + return HttpResponse("Inicio") + +def servicios(request): + return HttpResponse("Servicios") + +def tienda(request): + return HttpResponse("Tienda") + +def blog(request): + return HttpResponse("Blog") + +def contacto(request): + return HttpResponse("Contacto") +``` +Project/**urls.py** +``` +from django.contrib import admin +from django.urls import path +from ProyectoWebApp import views + +urlpatterns = [ + path('admin/', admin.site.urls), + path('', views.home, name="Inicio"), + path('servicios/', views.servicios, name ='Servicios'), + path('tienda/', views.tienda, name ='Tienda'), + path('blog/', views.blog, name ='Blog'), + path('contacto/', views.contacto, name='Contacto'), +] +``` + +*Como es común un proyecto se compone de varias Apps* +*Y una App puede ser reutilizada en otro proyecto* +*urls.py explica como organizar urls para manejar multiples Apps* + + +### Organizar URLs + +**Including another URLconf** + - 1. **Import** the **include()** function: `from django.urls import include, path` + - 2. **Add a URL** to **urlpatterns**: `path('blog/', include('blog.urls'))` + + +Project/**urls.py** +``` +from django.contrib import admin +from django.urls import path, include + + +urlpatterns = [ + path('admin/', admin.site.urls), + path('ProyectoWebApp/', include('ProyectoWebApp.urls')), +] +``` +Para **evitar** tener que escribir `misitio.com/ProyectoWebApp/home` +**Especificar** `''` el **path** en *ProyectoWeb/**urls.py*** + +### Crear urls.py en la carpeta de la aplicacion +App/**urls.py** +``` +from django.urls import path +from ProyectoWebApp import views + +urlpatterns = [ + path('', views.home, name="Inicio"), + path('servicios/', views.servicios, name ='Servicios'), + path('tienda/', views.tienda, name ='Tienda'), + path('blog/', views.blog, name ='Blog'), + path('contacto/', views.contacto, name='Contacto'), +] +``` + +## Crear Templates +inicio - servicios - tienda - blog - contacto + +Estructura de directorios por convención: +***ProyectoWebApp/templates/ProyectoWebApp/*** + +### Registrar App +Project/**settings.py** +``` +INSTALLED_APPS = [ + ... + 'ProyectoWebApp', +] +``` + +### Modificar vistas para html +App/**views.py** +``` +from django.shortcuts import render, HttpResponse + +def home(request): + return render(request, "ProyectoWebApp/home.html") + +def servicios(request): + return render(request, "ProyectoWebApp/servicios.html") + +def tienda(request): + return render(request, "ProyectoWebApp/tienda.html") + +def blog(request): + return render(request, "ProyectoWebApp/blog.html") + +def contacto(request): + return render(request, "ProyectoWebApp/contacto.html") +``` +