Categoria: Senza categoria

Come caso utilizziamo dominio drservice.it e seguo documentazione mozilla

configurazione nginx

faccio redirect port 80 su 443 e rispondo sia per https://drservice.it

utilizzo curl

per capire referral page

( like me :) ) - curl official site

What’s curl used for?

curl is used in command lines or scripts to transfer data. curl is also used in cars, television sets, routers, printers, audio equipment, mobile phones, tablets, settop boxes, media players and is the Internet transfer engine for thousands of software applications in over ten billion installations.

oltre che a trasferire è molto utile per debug dialogo client/server http/s

curl -v -I -H "Testing: Test header so you see this works" http://stackoverflow.com/

-I, –head
(HTTP FTP FILE) Fetch the headers only! HTTP-servers feature the command HEAD which this uses to get nothing but the header of a document. When used on an FTP or FILE file, curl displays the file size and last modification time only.

-H, –header <header/@file>

eventualmente -X HEAD, mostra intestazioni come tipo richiesta http

this time…

I write this in English (with google translator help 🙂 ) but, probably, will be better than only in Italian.
I’m not a good writer even in Italian, so sorry for the mistakes…
I thought so, why not start with multilingual 🙂 🙂 🙂

for now only some link

• disable specific url
• debug varnish
• setup wordpress

I have old angular app, client side render (CSR), and I want restyling with bootstrap look without force client to download heavy boundle.

Step by step I generate new angular app (CSR), test it then, if all ok, move to server side render (SSR).

documentation & inspiration

official angular universal
techniques and concepts surrounding SSR to understand (CSR) and (SSR)
on Medium, step-by-step realy well explained
example on angular-university

Angular install:

create a new dir for test my-universal-dir it is not important, and add angular, not global, and generate new project uni-t01:

$ mkdir my-universal-dir
$ cd my-universal-dir
: /my-universal-dir$ npm install @angular/cli
: /my-universal-dir$ ng new uni-t01
: /my-universal-dir$ cd uni-t01
: /new uni-t01$ ng serve   /* or npm start */

If all is ok we can see default app-page:

photo

we add universal pack:

: /new uni-t01$ ng add @nguniversal/express-engine

I add script to test time server render

<script>
    const po = new PerformanceObserver((list) => {
      for (const entry of list.getEntriesByName('first-contentful-paint')) {
        console.log('FCP: ', entry.startTime);
        po.disconnect();
      }
    });
    po.observe({type: 'paint', buffered: true});
  </script>

test client (CSR):

$ npm start     /* FCP:  257.6799999224022 */

and dev test (SSR) port 4200:

$ npm run dev:ssr.   /* FCP:  90.47499997541308 second reload */

add bootstrap package

$ npm install bootstrap

and modify /src/styles.scss

@import "../node_modules/bootstrap/scss/bootstrap";

add in my app-page test code

<h1>Bootstrap test</h1>    
<br>    
<br>    
<span class="badge rounded-pill bg-primary">Primary</span>    
<span class="badge rounded-pill bg-secondary">Secondary</span>    
<span class="badge rounded-pill bg-success">Success</span>    
<span class="badge rounded-pill bg-danger">Danger</span>    
<span class="badge rounded-pill bg-warning text-dark">Warning</span>    
<span class="badge rounded-pill bg-info text-dark">Info</span>    
<span class="badge rounded-pill bg-light text-dark">Light</span>    
<span class="badge rounded-pill bg-dark">Dark</span> 

and test (CSR)

$ npm run start     /* FCP:  272.9049999034032 */

and (SSR)

$ npm run dev:ssr    /* FCP: 358.6450000293553 second reload */

I have one web-app, on server-side all is the same, database and procedure on client-side I need to have different interface: one for desktop and one for iPad.

First of all, we map nginx variable and from a github example and add on my server block:

# before check if UA - user agent - come from desktop
map $http_user_agent $is_desktop {
    default 0;
    ~*linux.*android|windows\s+(?:ce|phone) 0; # exceptions to the rule
    ~*spider|crawl|slurp|bot 1; # bots
    ~*windows|linux|os\s+x\s*[\d\._]+|solaris|bsd 1; # OSes
}

## Revert the logic.
map $is_desktop $is_mobile {
    1 0;
    0 1;
}

Esistono diversi modi per inserire un file in formato svg in una pagina web, come indicato in mozzilla.org

se utilizzo il sistema veloce <img>

• non posso utilizzare css
• scarico file una sola volta

se utilizzo <svg>

• posso manipolare con css
• codice in linea
• devo duplicare ogni ricorrenza
• browser non fa cache

Posso anche utilizzare il sistema filter

quindi se non ci sono particolari necessità, animazioni o altro modifico direttamente style nel file.

Installazione differente da multidomain, non ho diverse sezioni dello stesso sito ma siti differenti: es: example.com e altrodominio.it, magari anche per differenti clienti.

Cerco quindi di minimizzare duplicazioni di file/cartelle che rimangono fondamentalmente costanti per ogni installazione/dominio

# mkdir wp-core
# cd wp-core
// copio file installazione wordpress-5.7.1.tar.gz
# tar -xzvf wordpress-5.7.1.tar.gz
# rm wordpress-5.7.1.tar.gz
# mv wordpress/ wp-5.7.1-r21.01
# chown -R www-data:www-data wp-5.7.1-r21.01 

Dove decido di caricare i file ‘costanti’ creo un folder wp-core, copio e estraggo la mia versione di partenza, in questo caso wordpress-5.7.1.tar.gz, rimuovo e rinomino, e assegno a utente es www-data:www-data

• wp nome a caso breve
• 5.7.1 release installazione, se in futuro voglio avere diverse versioni
• r21.01 relase del 2021 numero 01

adesso per ogni dominio creo un link a mio piacere es: abc-www per il dominio www.abc.com che collego alla mia installazione principale:

# ln -s wp-5.7.1-r21.01/ abc-www
// faccio test
# ls abc-www       // devo vedere file installazione wp

le varie installazioni punteranno solo a abc-www e se in futuro cambio versione … cambio un link solo

Creazione link

Di norma durante la creazione dei link meglio rinominare originale, creare link poi se tutto va bene dopo test elimino folder rinominato, es per wp-admin:

# cd /al/mio/folder/sito/esistente
# mv wp-admin wp-admin.dist
# ln -s /usr/local/docker/wordpress/wp-core/ptc-www/wp-admin ./wp-admin

Non va… riprovo più avanti…