vanilla

Aloitus vanilla kanssa

Yleiskatsaus

Vanilla-kehys on yksinkertainen HTML-, CSS-, JavaScript- ja PHP-projektimalli. Se tarjoaa puhtaan lähtöpisteen ilman raskaita kehyksiä, antaen sinulle täyden hallinnan koodirakenteestasi.

Aloittaminen

Repositorion kloonaamisen jälkeen voit aloittaa työskentelyn välittömästi:

1

Kloonaa Repositorio

Projektisi on valmis käytettäväksi kloonauksen jälkeen.

2

Määritä Tietokanta (Valinnainen)

Jos käytät PHP:tä MySQL:n kanssa, päivitä tietokannan tunnistetiedot PHP-tiedostoihisi.

$host = 'palvelimesi';
$dbname = 'tietokantasi';
$username = 'käyttäjänimesi';
$password = 'salasanasi';
3

Aloita Kehitys

Muokkaa HTML-, CSS-, JavaScript- ja PHP-tiedostoja suoraan.

Projektirakenne

├── index.html          # Pää-HTML-tiedosto
├── css/
│   └── style.css       # Tyylitiedostot
├── js/
│   └── script.js       # JavaScript-tiedostot
├── php/
│   └── api.php         # PHP-backend-tiedostot
├── images/             # Kuvaresurssit
└── README.md           # Projektidokumentaatio

Keskeiset Teknologiat

HTML5

Jäsennä verkkosivusi semanttisilla HTML-elementeillä.

CSS3

Muotoile sivusi moderneilla CSS-ominaisuuksilla kuten Flexbox ja Grid.

JavaScript

Lisää vuorovaikutteisuutta vanilla JavaScriptillä - kirjastoja ei tarvita.

PHP

Rakenna backend-toiminnallisuus PHP:llä palvelinpuolen käsittelyyn.

Tietokantayhteys (PHP)

<?php
$host = 'localhost';
$dbname = 'tietokanta_nimi';
$username = 'käyttäjänimi';
$password = 'salasana';

try {
    $pdo = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e) {
    die("Yhteys epäonnistui: " . $e->getMessage());
}
?>
Lisätietoja löytyy MDN Web Docs HTML-, CSS- ja JavaScript-dokumentaatiosta.