---
# System prepended metadata

title: Framework digitalització del petits comerços
tags: [TFG]

---

---
documentclass: tfgitic
author: Artur Blaya
header-includes: |
  \addbibresource{tfg.bib}
  \subtitle{Versió 0.0}
  \author{Artur Blaya}
  \title{TFG Artur Blaya}
  \advisor{Ilker Demirkol}
  \dedication{Text dedicatoria}
  \begin{acknowledgments}
    text agraiments
  \end{acknowledgments}
  \begin{resum}
    text parlant del resum
  \end{resum}
  \begin{abstract}
    text parlant del abstract
  \end{abstract}
---
###### tags: `TFG`

\part{Memòria}

\chapter{Introducció}

# Framework digitalització del petits comerços
La idea principal és fer un servei que permeti digitalitzar el teu comerç en 1h. 

## Arquitectura
### formulari 
L'usuari que vol la web, lùnic que ha de fer es fer un formulari, on se li demana informació, tant obligatoria com opcional, com logo, nom empresa, productes, etc.

### Estructura
La plantilla serà dinàmica, a partir de l'àmbit de la teva empresa, i altre informació a definir, és posaran uns continguts a la plantilla o no. Els continguts seran components que estaran o no depepent de la plantilla.

Hi ha camps del formulari opcionals. Son opcionals ja que poden ser "calculats" automàticament ( processament/IA ). 
Aquests camps, si no els especifíques seran calculats automàticament.

exemples: 
* font
* Esquema de colors
* patrons


### Ajustos avançats 
És podrà modificar l'esquelet de la pàgina. Per exemple, si s'ha construït la pagina seguint el template de tenda de verdures, i la teva tenda vols algo diferent, pots afegir o modificar components.

### Analìtica Web
A la pàgina hi haurà un seguiment dels events que succeixen amb google analytics
Amb les dades obtingudes, es podrà fer una informe automatitzat.

### Tecnologies
Es farà ús de tecnologies com mongo, express, react i heroku


# Next 13
From JavaScript to React / How to continue learning React / From React to Next.js
While React excels at building UI, it does take some work to independently build that UI into a fully functioning scalable application. 

babel susa per transformar jsx a codi html i js.

What is Code Splitting?
Developers usually split their applications into multiple pages that can be accessed from different URLs. Each of these pages becomes a unique entry point into the application.
Code-splitting is the process of splitting the application’s bundle into smaller chunks required by each entry point. The goal is to improve the application's initial load time by only loading the code required to run that page.

Next.js has built-in support for code splitting. Each file inside your pages/ directory will be automatically code split into its own JavaScript bundle during the build step.

With Next.js, three types of rendering methods are available: Server-Side Rendering, Static Site Generation, and Client-Side Rendering.

Note: React 18 and Next 12 introduce an alpha version of React server components. Server components are completely rendered on the server and do not require client-side JavaScript to render. In addition, server components allow developers to keep some logic on the server and only send the result of that logic to the client. This reduces the bundle size sent to the client and improves client-side rendering performance

# Introducció

# Framework digitalització del petits comerços
La idea principal és fer un servei que permeti digitalitzar el teu comerç en 1h. 

## Arquitectura
### formulari 
L'usuari que vol la web, lùnic que ha de fer es fer un formulari, on se li demana informació, tant obligatoria com opcional, com logo, nom empresa, productes, etc.

### Estructura
La plantilla serà dinàmica, a partir de l'àmbit de la teva empresa, i altre informació a definir, és posaran uns continguts a la plantilla o no. Els continguts seran components que estaran o no depepent de la plantilla.

Hi ha camps del formulari opcionals. Son opcionals ja que poden ser "calculats" automàticament ( processament/IA ). 
Aquests camps, si no els especifíques seran calculats automàticament.

exemples: 
* font
* Esquema de colors
* patrons


### Ajustos avançats 
És podrà modificar l'esquelet de la pàgina. Per exemple, si s'ha construït la pagina seguint el template de tenda de verdures, i la teva tenda vols algo diferent, pots afegir o modificar components.

### Analìtica Web
A la pàgina hi haurà un seguiment dels events que succeixen amb google analytics
Amb les dades obtingudes, es podrà fer una informe automatitzat.

### Tecnologies
Es farà ús de tecnologies com mongo, express, react i heroku


# Next 13
From JavaScript to React / How to continue learning React / From React to Next.js
While React excels at building UI, it does take some work to independently build that UI into a fully functioning scalable application. 

babel susa per transformar jsx a codi html i js.

What is Code Splitting?
Developers usually split their applications into multiple pages that can be accessed from different URLs. Each of these pages becomes a unique entry point into the application.
Code-splitting is the process of splitting the application’s bundle into smaller chunks required by each entry point. The goal is to improve the application's initial load time by only loading the code required to run that page.

Next.js has built-in support for code splitting. Each file inside your pages/ directory will be automatically code split into its own JavaScript bundle during the build step.

With Next.js, three types of rendering methods are available: Server-Side Rendering, Static Site Generation, and Client-Side Rendering.

Note: React 18 and Next 12 introduce an alpha version of React server components. Server components are completely rendered on the server and do not require client-side JavaScript to render. In addition, server components allow developers to keep some logic on the server and only send the result of that logic to the client. This reduces the bundle size sent to the client and improves client-side rendering performance

# Antecedents
# Estudi econòmic
# Impacte ambiental
# Conclusions
# Treball futur


\part{Apèndixs}