CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 ·...
Transcript of CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 ·...
![Page 1: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/1.jpg)
CREACIÓ D’UN CMS AMB
METEORJS I ANGULARJS
Jordi Campeny Puig
Grau de Multimèdia
Enginyeria web
Ignasi Lorente Puchades
Carlos Casado Martinez
25 de Gener del 2017
![Page 2: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/2.jpg)
ÍNDEX
1. CONTEXT
1.1 SITUACIÓ ACTUAL
1.2 PROBLEMES
1.3 NECESSITAT
2. OBJECTIUS
3. ENFOCAMENT
4. FUNCIONAMENT
4.1 INICIALITZACIÓ DE LA INFRAESTRUCTURA A NIVELL D’USUARI
4.2 LAYOUTS
4.3 PÀGINES
4.4 STATES
4.5 COMPILADOR
5. CONCLUSIONS
![Page 3: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/3.jpg)
CONTEXT
1.1 SITUACIÓ ACTUAL
1.2 PROBLEMES
1.3 NECESSITAT
1.
![Page 4: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/4.jpg)
1.1 SITUACIÓ ACTUAL
Augment de la demanda de creacions de pàgines web.
Altres CMS, com Wordpress, Drupal o Magento, ofereixen la possibilitat de crear pàgines
web amb molt poc temps.
![Page 5: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/5.jpg)
1.2 PROBLEMES
Requereixen coneixements tècnics a nivell de servidor per la seva
configuració i instal·lació.
Una pàgina creada amb un CMS estarà sempre més acoblada
a aquest.
![Page 6: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/6.jpg)
1.3 NECESSITAT
Crear un CMS per maquetadors on els clients puguin editar el seu contingut.
![Page 7: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/7.jpg)
OBJECTIUS
Crear un CMS que generi pàgines web des d’un servidor central.
Crear un sistema que refresqui les pàgines webs externes.
Disposar d’una interfície que permeti editar i crear una pàgina web.
2.
![Page 8: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/8.jpg)
OBJECTIUS
Les pàgines han de poder ser creades amb total llibertat per persones amb
coneixements de maquetació.
Els clients han de poder editar el seu contingut sense afectar la feina del
maquetador.
La pàgina web externa no ha de dependre del CMS un cop generada.
2.
![Page 9: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/9.jpg)
3.
ENFOCAMENT
Desenvolupament mitjançant metodologies àgils: Scrum.
Arquitectura modular: cada funcionalitat del CMS és independent de les altres.
Al finalitzar la incorporació d’una funcionalitat s’obté un producte estable.
La incorporació de noves funcionalitats no afectarà a les ja desenvolupades.
![Page 10: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/10.jpg)
FUNCIONAMENT
4.1 INICIALITZACIÓ DE LA INFRAESTRUCTURA A NIVELL D’USUARI
4.2 LAYOUTS
4.3 PÀGINES
4.4 STATES
4.5 COMPILADOR
4.
![Page 11: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/11.jpg)
4.1 INICIALITZACIÓ DE LA
INFRAESTRUCTURA A NIVELL D’USUARI
Registrar-se com a usuari a la pàgina del servidor.
Pujar via FTP un arxiu PHP.
![Page 12: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/12.jpg)
4.2 LAYOUTS
QUÈ SÓN?
o Seccions independents de les pàgines.
PER QUÈ SERVEIXEN?
o Totes les pàgines es componen de layouts.
o Són com unes plantilles.
o Poden ser compartides entre usuaris.
COM ES CREEN?
o Accedir a la secció “layouts”.
o “Crear nou layout”.
o “Afegir contenidors” (text, encapçalaments o imatge).
o “Editar contingut”.
o “Guardar”
![Page 13: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/13.jpg)
4.3 PÀGINES QUÈ SÓN?
o Cada una de les seccions de la pàgina web.
o Estan compostes per layouts.
PER QUÈ SERVEIXEN?
o Agrupen layouts i representen una secció de la web.
o Els layouts poden ser modificats dins d’una pàgina
sense afectar l’original.
COM ES CREEN?
o Accedir a la secció “pàgines”.
o “Crear nova pàgina”.
o “Afegir layouts”.
Ja guardats per l’usuari o públics.
Crear-ne un de nou independent.
o Editar i personalitzar els Layouts i els seus continguts.
o Guardar
![Page 14: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/14.jpg)
4.4 STATES
QUÈ ÉS?
o És un objecte que té cada un dels perfils de l’usuari.
o Representen el Sitemap de la pàgina web.
PER QUÈ SERVEIXEN?
o Modificar i personalitzar l’estructura jeràrquica de la web.
COM S’UTILITZA?
o Accedir a la secció "states".
o Modificar l’ordre a través de drag&drop.
o Modificar la jerarquia a través de drag&drop.
o Guardar al finalitzar.
![Page 15: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/15.jpg)
4.5 COMPILADOR
QUÈ ÉS?
o És un conjunt d’operacions que permeten actualitzar la pàgina web externa.
PER QUÈ SERVEIX?
o Crea els arxius font.
o Compila els arxius font.
o Envia els arxius font al servidor de l’usuari.
COM S’UTILITZA?
o Click al botó d’actualització.
![Page 16: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/16.jpg)
5. CONCLUSIONS
5.1 ASSIGANTURES POSADES EN PRÀCTICA.
5.2 NOUS CONEIXEMENTS APORTATS.
5.3 LÍNIES DE FUTUR.
![Page 17: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/17.jpg)
5.1 ASSIGANTURES POSADES EN PRÀCTICA.
DISSENY
o Arquitectura de la informació.
o Disseny d’interfícies multimèdia.
o Disseny gràfic.
![Page 18: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/18.jpg)
5.1 ASSIGANTURES POSADES EN PRÀCTICA.
ARQUITECTURA
o Enginyeria del programari.
o Anàlisi i disseny amb patrons.
o Disseny i programació orientada a objectes.
![Page 19: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/19.jpg)
5.1 ASSIGANTURES POSADES EN PRÀCTICA.
DESENVOLUPAMENT
o Assignatures de programació.
o Disseny de base de dades.
o Ús de base de dades.
![Page 20: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/20.jpg)
5.2 NOUS CONEIXEMENTS APORTATS.
Tot l’entorn NodeJS.
Bases de dades NoSQL (MongoDB).
![Page 21: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/21.jpg)
5.3 LÍNIES DE FUTUR.
Mòdul de gestió de continguts multimèdia.
Gestió d’idiomes.
Optimització de l’escalabilitat.
Adhesió de plugins.
Hosts propis.
![Page 22: CREACIÓ D’UN CMS AMBopenaccess.uoc.edu/webapps/o2/bitstream/10609/59586/7... · 2017-10-04 · CREACIÓ D’UN CMS AMB METEORJS I ANGULARJS Jordi Campeny Puig Grau de Multimèdia](https://reader034.fdocuments.co/reader034/viewer/2022042100/5e7c4bb931cc24237b4b6db4/html5/thumbnails/22.jpg)
CREACIÓ D’UN CMS AMB
METEORJS I ANGULARJS
Jordi Campeny Puig
Grau de Multimèdia
Enginyeria web
Ignasi Lorente Puchades
Carlos Casado Martinez
25 de Gener del 2017