Navigation für eine Website erstellen

Navigation für eine Website erstellen - Astro Website #2

Рет қаралды 2,437

Күн бұрын

JETZT das Komplette Tutorial anschauen ↪︎ • Eigene Website erstell...
Eine eigene Website erstellen mit dem All-In-One Framework Astro und Tailwind CSS. Ich zeige dir in einzelnen Schritten wie du dir eine Website mit Blog Funktionalität erstellen kannst, welche Animationen enthält, sowie eine Page Transition für die Navigation. Diese Website ist von Entwickler, für Entwickler und kann auch als Portfolio Website genutzt werden. Dies ist Part 2. Happy Coding!
😺 Source Code + Links
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
↪︎ github.com/ProgrammierenM/eig...
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
↪︎ astro.build/
↪︎ tailwindcss.com/
↪︎ iconify.design/
⏩ Videoinhalt
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
00:00 Einleitung
01:04 Tailwind CSS Extension
03:44 Seiten anlegen
10:42 Layout-Gerüst
16:15 Hauptnavigation
42:08 Icon Navigation
⭐ Das könnte dich auch interessieren
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Eigene Website erstellen mit Astro und Tailwind CSS - Playlist:
↪︎ • Eigene Website erstell...
Eigene Website erstellen in [2022] - Playlist:
↪︎ • mitmario.dev
Moderne Websites mit Web Components:
↪︎ • Moderne Web Entwicklun...
📌 Über diesen Kanal und mich
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Webentwicklung effizient und einfach. Alles rundum Webentwicklung, Webdesign und angrenzende Themen. Mein Name ist Mario und ich bin bereits seit vielen Jahren beruflich als Web Entwickler tätig. Einige Tutorials auf diesem Kanal sind für absolute Anfänger ohne Vorkenntnisse geeignet, und andere für erfahrene Entwickler.
Starte Jetzt!
/ @programmierenmario
#Website2023 #Astro #ProgrammierenM

Пікірлер: 24

@azna3021 Жыл бұрын

Wie immer klasse und einfach erklärt.

@ProgrammierenMario Жыл бұрын

Vielen Dank ✌️

@andreask.291 Жыл бұрын

Bin mal wieder hochbegeistert von Deinem Video. Wie immer pickepacke voll mit detaillierten Erklärungen für jeden einzelnen Schritt. Für mich auf jeden Fall 100% Top! ⭐️⭐️⭐️⭐️⭐️

@ProgrammierenMario Жыл бұрын

Gern geschehen! Wünsche dir ein schönes Wochenende ✌️

@birdy1 Жыл бұрын

Tolles Video mal wieder. Ich warte wohl noch bis zum dritten Video der Reihe und starte dann durch. Vielleicht wird das dann wirklich meine private, derzeit WordPress Seite ersetzen.😊Danke für Deine Mühen!

@ProgrammierenMario Жыл бұрын

Ja es sind dazu noch ein paar Videos geplant. ✌️🙂

@andreaskruger7128 Жыл бұрын

Vielen Dank für das mega tolle Video. Das war wieder der Wahnsinn. Mit so einer Leichtigkeit wie du es rüber bringst. Wenn ich früher solche Lehrer gehabt hätte wäre aus mir vielleicht etwas geworden.

@ProgrammierenMario Жыл бұрын

Ob man etwas geworden ist? Was auch immer dies bedeuten mag bzw. was auch immer die Gesellschaft von einem erwartet. Jeder entscheidet selbst für sich über das eigene Leben. Glück kann man in allem finden. Vielen Dank fürs reinschauen. Wünsche dir noch eine schöne Woche ✌️🙂

@yt7042 Жыл бұрын

Tolles Video. Leider fehlt mir aktuell die Zeit für so ein Projekt. Schönes WE!

@ProgrammierenMario Жыл бұрын

Rennt ja nicht weg. Schönes Wochenende 🙂

@KD-ov3yf Жыл бұрын

👍

@ProgrammierenMario Жыл бұрын

✌️

@badmax7319 Жыл бұрын

Tolles Video, vielleicht kannst du mal ein Video über die verschiedenen Frameworks machen, denn ich verliere total den Überblick, was für was verwendet wird. Vue, Svelte, Sveltekit, Astro, Nuxt, Next.js, Vite, usw.....langsam dreh ich durch, ich weiss nicht was ich lernen soll. vor zwei Tagen mit SvelteKit experimentiert, aber da komme ich mit dem Adapter nicht wirklich klar. An manchen Tagen möchte man einfach alles nur hinschmeissen, weil es einem über den Kopf wächst.

@yt7042 Жыл бұрын

Fange mit den Basics an und versuche nicht alles auf einmal zu lernen. Es dauert halt alles seine Zeit.

@badmax7319 Жыл бұрын

@@yt7042 Nicht lachen, ich mach das schon seit 14 Jahren beruflich. Nur eben mit HTML. PHP und CSS und jetzt wollte ich mich mehr mit JS anfreunden und werde hier erschlagen.

@yt7042 Жыл бұрын

@@badmax7319 Dann kommst du ja aus dem Script Bereich, wenn auch serverseitig. JS ist etwas eigen, aber auch hier solltest du erst einmal die Basics beherrschen bevor du an die Frameworks gehst. Das Problem ist auch, dass der Markt ziemlich dynamisch ist. Es gibt ständige etwas neues zu lernen, ohne dass es am Ende einen Mehrwert bietet.

@ProgrammierenMario Жыл бұрын

@badmax7319 Ich schreibe es mir gerne mal mit auf.

@badmax7319 Жыл бұрын

@@ProgrammierenMario Das wäre super. Übrigens tolle Videoreihe, kann kaum das nächste Video erwarten. Du erklärst das echt so, dass *ich* es versteh :-)

@cv-camposviolaphotography5540 Жыл бұрын

Hallo Mario, danke für das Tolle Video. Eine Frage habe ich bzgl. verschachteln, wen man in "pages" einen Unterordner erstellt, wie hochzeit/block.astro dann wird der Befehl in der Blockseite "import Layout from '../layouts/Layout.astro';" nicht mehr gefunden da die Seite im Unterordner liegt. Wie behebe ich den Fehler ohne auf Unterordner zu verzichten? vielen dank für dein Bemühen.

@ProgrammierenMario Жыл бұрын

In diesem Fall müsstest du einen Ordner weiter hoch, z.B. ../../layouts/Layout.astro

@groovebird812 Жыл бұрын

Super Video :-) Könnte man denn in die Component SocialBar auch noch das nav-Tag direkt mit reinnehmen oder hat es einen Vorteil, wenn das im Layout steht?

@ProgrammierenMario Жыл бұрын

Ja das geht! Wie du das ganze aufteilst oder unterteilst, da bist du vollkommen frei.

@celebicelebi Жыл бұрын

In min 2:58 finde ich zwar diesen Ordner, aber dort ist nicht das selbe drinnen, sodass ich das ändern kann woran liegt es ? Und bei 7:16 wird mein text nicht ge heiligtet wie kann ich das alles beheben ? und mir werden auch keine vorschläge gemacht also wenn ich beispielsweise schreibe wird es mir währenddessen nicht vorgeschlagen und wenn ich es dann geschrieben kommt kein schließendes tag. wie kann ich das beheben

@ProgrammierenMario Жыл бұрын

Hast du dir das Erste Video angeschaut? Da zeige ich wie das Projekt eingerichtet wird. Wenn gewisse Einstellungen bei dir fehlen, dann müsstest du diese noch bei dir setzen. Für die Autovervollständigung in den astro Dateien brauchst du die VS Code Extension für Astro.