Accueil

Voici une petite explication pour mieux comprendre les objets "node", "element" en HTML.

Un node est le nom générique de tout type d'objet présent dans le DOM. Un node peut être l'un des éléments DOM intégrés tels que document ou document.body, ou il peut s'agir d'une balise HTML spécifiée dans le code, telle que <input> ou <p>.

Un Element est un type spécifique de node. De plus, il existe de nombreux autres types de node.

Le DOM se compose d'une hiérarchie de node où chaque nœud peut avoir un parent, une liste de nœuds enfants et une instruction nextSibling et previousSibling. Cette structure forme une hiérarchie arborescente. Le nœud de document aurait sa liste de nœuds enfants (le nœud principal et le nœud du corps).

Ainsi la HTMLElement hérite de Element. De là, émane l'ensemble des éléments HTML que nous connaissons tous (comme HTMLInputElement pour la balise input, par exemple).

Pour plus d'informations

En développant une application sous la version 5 du framework TypeScript Angular, je suis un jour tombé sur une erreur récurrente et qui semblait impossible à résoudre. La voici :

scripts.bundle.js net::ERR_ABORTED

Cette erreur était visible sur la console du navigateur web.

Pour la résoudre, il a juste suffit de lancer la commande suivante :

npm cache verify

En espérant que cette astuce vous aidera !

Dans Android Studio, l'affichage de logs dans la console (logCat) se fait grâce à la classe android.util.Log. Hélas, il arrive parfois que l'on ait besoin d'en afficher plus. Voici un code simple pour pallier à ce problème :

int maxLogSize = 1000;

for(int i = 0; i <= veryLongString.length() / maxLogSize; i++) {
    int start = i * maxLogSize;
    int end = (i+1) * maxLogSize;
    end = end > veryLongString.length() ? veryLongString.length() : end;
    Log.v(TAG, veryLongString.substring(start, end));
}

(Source)

La position absolue (position: absolute) permet de placer un élément sans que soit pris en compte l'ordre dans lequel les éléments HTML sont déclarés dans le code.

La position relative (position: relative) permet de placer un élément par rapport à une position de référence.

En CSS, il est possible de définir à partir de quel élément la position est absolue. Pour ce faire, il suffit de définir la propriété "position: relative" à l'élément parent à partir duquel on souhaite positionner notre élément absolu.

Dans l'exemple ci-dessous, on positionne un bouton en bas à gauche d'un div :

.container {
    border: 1px solid #E9E3DD;
    float: left;
    height: 210px;
    margin: 2px;
    padding: 4px 2px 10px 10px;
    text-align: left;
    width: 117px;
    position:relative;
}

#bottom_button {
   position:absolute;
   bottom:0;
   left:0;
}

<div class="container">
    <div id="bottom_button">
                <input type="submit" value="Submit">
        </div>
</div>

Pour des besoins de référencement, il devient indispensable de générer de belles URL.Voici un petit script Python (compatible avec la version 3.*) pour sluggifier vos URLs :

_punct_re = re.compile(r'[\t !’"#$%&\'()*\-/<=>?@\[\\\]^_`{|},.]+')

def slugify(text, delim=u'-'):
        """Generates an ASCII-only slug."""
        result = []
        for word in _punct_re.split(text.lower()):
                result.extend(unidecode(word).split())
        return str(delim.join(result))

On passe comme paramètre le titre d'un article (par exemple) que l'on veut voir apparaître dans l'URL. Ce script va remplacer tous les caractères spéciaux (accents, apostrophe,...) par de simples tirets et mettre la chaîne de caractères en minuscule.

Mettre la base de données à jour :

Si votre site est déjà lancé et que vous souhaitez stocker vos URLs dans votre base de données, vous pourrez utiliser le script suivant pour la mettre à jour :

from sqlalchemy import create_engine

engine = create_engine("postgresql+psycopg2://postgres:password@localhost:5432/flask")
connection = engine.connect()
result = connection.execute("SELECT * FROM article")

for row in result:
        query = "UPDATE article SET slug = '" + slugify(row['title']) + "' WHERE id = " + str(row['id'])
        connection.execute(query)
        print(query)

Post-scriptum :

Ce script s'inspire de la page "Generating slug".

Toutes applications Python nécessitent, bien souvent, plusieurs dépendances ou paquets. Ainsi, lorsque l'on souhaite installer notre application, il peut être pratique d'installer en même temps l'ensemble des dépendances très rapidement. Pour ce faire, on peut utiliser un fichier "requirements.txt". Celui-ci est placé à la racine de votre projet et répertorie la totalité des dépendances.

Pour le générer, on peut utiliser un petit outil appelé "pipreqs". Afin de l'installer, on lance la ligne de commande suivante :

pip install pipreqs

Pour générer notre fichier, on utilisera la commande qui suit :

pipreqs /chemin/vers/votre/projet

Une fois cette opération terminée, un fichier "requirements.txt" apparaîtra à la racine de votre projet. Il se présentera sous cette forme :

Flask_Mail==0.9.1
Werkzeug==0.11.11
Flask_Script==2.0.5
pyreadline==2.1
Flask_WTF==0.13.1
WTForms==2.1
SQLAlchemy==1.1.2
Flask_Babel==0.11.1
Jinja2==2.8
Flask_SQLAlchemy==2.1
Pillow==4.1.1

Pour installer l'ensemble des dépendances présentes dans ce fichier, il existe une commande :

pip install -r requirements.txt

Sur Linux, il existe une commande fonctionnant sur la plupart des plateformes et permettant d'afficher le nom et la version de l'OS ainsi qu'une pléthore d'autres informations. La voici :

cat /etc/*-release

Exemple de résultat :

DISTRIB_ID=Ubuntu
DISTRIB_RELEASE=10.04
DISTRIB_CODENAME=lucid
DISTRIB_DESCRIPTION="Ubuntu 10.04.4 LTS"

Font Awesome est un fantastique outil utilisé par plusieurs centaines de milliers de sites Internet à travers le monde. Il fournit une multitude d'icônes facilement personnalisables et adaptables à n'importe quelles applications. Seulement, cette librairie a un manquement : comment peut-on faire des icônes avec des lettres de l'alphabet ? Heureusement, il existe une technique simple pour parvenir à cet objectif.

HTML :

<span class="fa fa-a"></span><br/>
<span class="fa fa-b"></span><br/>
<span class="fa fa-downcase-a"></span><br/>

CSS :

body {
    font-size: 14px;
}

.fa-a:before {
    font-family: Arial; /* your font family here! */
    font-weight: bold;
    content: 'A';
}

.fa-downcase-a:before {
    font-family: Arial; /* your font family here! */
    font-weight: bold;
    content: 'a';
}

.fa-b:before {
    font-family: Arial; /* your font family here! */
    font-weight: bold;
    content: 'B';
}

En MySQL, il existe une astuce pour faire la somme d'une somme très simplement ; il s'agit du modificateur "WITH ROLLUP".

Exemple :

Soit la table suivante que nous appellerons "test" :

+------+--------+
| year | price  |
+------+--------+
| 2000 |   500  |
| 2000 |   9.5  |
| 2001 |   5.2  |
| 2000 |   47   |
| 2001 |   98   |
+------+--------+

Si nous souhaitons calculer la somme de la colonne "price" par années, on fait la requête suivante :

SELECT SUM(price)
FROM test
GROUP BY year

Résultat :

+------------+
| SUM(price) |
+------------+
|    556.5   |
|    103.2   |
+------------+

Maintenant, si nous souhaitons faire la somme total de l'ensemble des éléments de la colonne "price", on pourra utiliser la fonctionnalité "WITH ROLLUP" :

SELECT SUM(price)
FROM testprice
GROUP BY year
WITH ROLLUP

Résultat :

+------------+
| SUM(price) |
+------------+
|    556.5   |
|    103.2   |
|    659.7   |
+------------+

• Documentation MySQL

En C#, vous pouvez facilement tester si une ou plusieurs chaînes de caractère sont contenues dans une autre. Dans l'exemple qui suit, nous allons utiliser le "Language-Integrated Query" (ou LINQ) pour effectuer cette opération.

Dans cet exemple, nous souhaitons simplement tester si la chaîne "salut", contient les caractères "a", "b" ou "c".

using System.Linq;
...

string[] stringsToSearch = new string[] { "a", "b", "c" };
string s = "salut";

stringToSearch.Any(c => s.Contains(c)); // renverra 'true'

Voici une petite expression régulière qui vous permettra de supprimer les commentaires HTML :

/<!--(.*)-->/Uis

Exemple d'utilisation :

$html = "<p>Hello World!</p><!-- début d'un div--><div>Justin II (latin : Flavius Iustinus Iunior Augustus, grec : Φλάβιος Ἰουστίνος ὁ νεότερος) règne sur l’Empire byzantin du 15 novembre 565 à sa mort le 5 octobre 578 ; il est le neveu et successeur de Justinien Ier.</div><!-- find du div -->";
        
$html = preg_replace('/<!--(.*)-->/Uis', '', $html);

echo "<p>Hello World!</p><div>Justin II (latin : Flavius Iustinus Iunior Augustus, grec : Φλάβιος Ἰουστίνος ὁ νεότερος) règne sur l’Empire byzantin du 15 novembre 565 à sa mort le 5 octobre 578 ; il est le neveu et successeur de Justinien Ier.</div>";

Voici une fonction simple afin de supprimer des balises HTML en PHP :

function removeTag($html, $tag) {
    return preg_replace('#</?'.$tag.'[^>]*>#is', '', $html);
}

Exemple d'utilisation :

$html = "<p><span class='bold'>Texte en gras</span></p>";

echo removeTag($html, $tag);
// Affichera '<p>Texte en gras</p>'