Blogseite mit JavaScript für Schülerzeitung?

Guten Abend

Ich bin gerade daran für unsere Schülerzeitung eine Webseite zu erstellen.

auf dieser dürfen natürlich zwei Sachen nicht fehlen, nämlich die letzten Zeitungen, und eine Art Blogseite in der die Neusten News aufgelistet werden.

Ich habe mich für dieses Projekt mit HTML Code auseinandergesetzt, und beherrsche ihn zwar nicht gut jedoch für meine Anforderungen gut genug.

nun zur eigentlichen Frage, wie muss der JavaScript lauten das Folgende Anforderungen erfüllt werden?

Ich stelle mit die Blogseite so vor:

Auf der Blogseiten werden immer genau 5 Artikel geladen.

Die Artikel sind .jpg Dateien

wenn man einen Neuen Artikel hochladen will, soll man einfach eine .jpg Datei namens "neuerartikel" in einen unter-ordner (namens: "Artikel") laden, daraufhin wird der "neueartikel zu "artikel1" , "artikel1" zu "artikel2" , "artikel2" zu "artikel3" USW. umbenannt. Der 5te Artikel (der ja danach zum 6ten wird) wird automatisch gelöscht, so dass der neuste Artikel oben angezeigt wird, und dann die anderen alle einen platz nach unten rutschen. Der 6te Artikel wird immer automatisch entfernt.

so kann ich d an ganz einfach die Bilder in den HTML Code der reihe nach anordnen.

Genau nach der gleichen Technik sollte dann auch die Letzten Ausgaben aufgelistet werden (Nur das die .jpg Dateien dann "neueausgabe", "ausgabe1" USW. heißen.)

Ich bin mir bewusst das das ein sehr komplexes Problem ist, jedoch hab ich noch nie JavaScript angefasst, und bin so komplett überfragt. Ich wäre also sehr froh über eure Hilfe, und bedanke mich schon im voraus!

LG

Roland Eggenweiler

Computer, Technik, HTML, Webseite, Programmieren, JavaScript, Schülerzeitung, Technologie
php bild komprimieren, stimmt dieser code?

Ich habe diesen code auf https://www.codexworld.com/compress-image-before-upload-using-php/ gefunden und bei mir kommt eine success nachricht aber das bild erscheint nicht im zielordner obwohl ich nichts ungewöhnliches auf den ersten blick sehe:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
    <label>Select Image File:</label>
    <input type="file" name="image">
    <input type="submit" name="submit" value="Upload">
</form>
</body>
</html>

upload.php:

<?php 
 
/* 
 * Custom function to compress image size and 
 * upload to the server using PHP 
 */ 
function compressImage($source, $destination, $quality) { 
    // Get image info 
    $imgInfo = getimagesize($source); 
    $mime = $imgInfo['mime']; 
     
    // Create a new image from file 
    switch($mime){ 
        case 'image/jpeg': 
            $image = imagecreatefromjpeg($source); 
            break; 
        case 'image/png': 
            $image = imagecreatefrompng($source); 
            break; 
        case 'image/gif': 
            $image = imagecreatefromgif($source); 
            break; 
        default: 
            $image = imagecreatefromjpeg($source); 
    } 
     
    // Save image 
    imagejpeg($image, $destination, $quality); 
     
    // Return compressed image 
    return $destination; 
} 
 
 
// File upload path 
$uploadPath = "./uploads/"; 
 
// If file upload form is submitted 
$status = $statusMsg = ''; 
if(isset($_POST["submit"])){ 
    $status = 'error'; 
    if(!empty($_FILES["image"]["name"])) { 
        // File info 
        $fileName = basename($_FILES["image"]["name"]); 
        $imageUploadPath = $uploadPath . $fileName; 
        $fileType = pathinfo($imageUploadPath, PATHINFO_EXTENSION); 
         
        // Allow certain file formats 
        $allowTypes = array('jpg','png','jpeg','gif'); 
        if(in_array($fileType, $allowTypes)){ 
            // Image temp source 
            $imageTemp = $_FILES["image"]["tmp_name"]; 
             
            // Compress size and upload image 
            $compressedImage = compressImage($imageTemp, $imageUploadPath, 75); 
             
            if($compressedImage){ 
                $status = 'success'; 
                $statusMsg = "Image compressed successfully."; 
            }else{ 
                $statusMsg = "Image compress failed!"; 
            } 
        }else{ 
            $statusMsg = 'Sorry, only JPG, JPEG, PNG, & GIF files are allowed to upload.'; 
        } 
    }else{ 
        $statusMsg = 'Please select an image file to upload.'; 
    } 
} 
 
// Display status message 
echo $statusMsg, $imageUploadPath;
?>
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<img src="<?php echo $imageUploadPath ?>">
</body>
</html>
Computer, HTML, Webseite, Programmieren, JavaScript, PHP

Meistgelesene Fragen zum Thema Webseite