HTML Einfach HTML Einsteiger Frage zum Programmierkonzept

Pille1002

Lt. Junior Grade
Registriert
Apr. 2013
Beiträge
396
Hallo Zusammen,

ich spiele gerade ein wenig mit HTML & JS.
Ich möchte mir eine kleine (Web) Anwendung schreiben, ich verwende hierzu HTML / JS und Bootstrap (für responsive).

Meine Frage:
In den Anfängen von HTML wurden eine Website mit Frames aufgeteilt (Head/Content/Footer usw.).
Da Frames nicht mehr verwendet werden überlege ich mir gerade wie momentan in der Modernen Webentwicklung sauber getrennt wird zwischen diesen bereichen.
In HTML 5 gibt es nun ja extra TAGs hierfür (Header / Footer usw).

Konkret stehe ich grad vor der Überlegung, das ich auf meiner Website oben eine Navbar (Bootstrap) eingefügt habe und mit einem Button auf eine Unterseite springen möchte (in meinem Verständnis würde ich jetzt einfach nur die unterseite.html aufrufen), dort müsste aber ja wieder die komplette Navbar/JS src / Bootstrap src eingebunden werden usw..

Ich denke das man heute einfach nur den Content austauscht in der Index?
Oder wie ist den heute das aktuelle verfahren hierzu?
Gerne auch einen Link.

Meine HTML Kenntnisse sind schon Jahre alt, daher bin ich momentan wieder eher ein Einsteiger wenn es um Web- Architektur geht.

Danke
 
Wenn Du serverseitig z.B. mit PHP arbeitest, kannst Du Includes verwenden um z.B. die Navbar auszulagern.

Das mit Content austauschen, macht man mit AJAX (und das geht am besten mit Javascript), am einfachsten Du verwendest dafür das jQuery Framework (vereinfacht das Handling mit Javascript) und den dortigen Aufruf ajax() - die Dokumentation bei jQuery ist sehr gut und verständlich (solltest also mit diesen Stichworten weiterkommen). So könntest Du z.B. auch die Navbar auslagern und dann jeweils nachladen.
 
Zuletzt bearbeitet:
Hallo Lawnmower,
das habe ich auch schon gelesen (Server seitig über PHP), ich verwende aber nur JS (Client seitig) HTML und CSS
Ergänzung ()

Lawnmower schrieb:
Wenn Du serverseitig z.B. mit PHP arbeitest, kannst Du Includes verwenden um z.B. die Navbar auszulagern.

Das mit Content austauschen, macht man mit AJAX (und das geht am besten mit Javascript), am einfachsten Du verwendest dafür das jQuery Framework (vereinfacht das Handling mit Javascript) und den dortigen Aufruf ajax() - die Dokumentation bei jQuery ist sehr gut und verständlich (solltest also mit diesen Stichworten weiterkommen).

Okey ..
JQuery als JS Framework verwende ich bereits..
Also wird der dynamische austausch immer noch mit AJAX gemacht.
Dachte in denn ganzen Jahren hätte sich mehr getan ^^ und es gibt schon "fancyere" Möglichkeiten..
Dank dir
 
Die Frage ist was willst du machen?

Ich würde auf ein CMS setzen und mich mit der entsprechenden Template Engine auseinander setzen. Ich nutze Drupal 8, hat eine sau große Community, extrem viele Plugins und eine sehr gut Doku mit Videos von div. Leuten.

Ansonstne gilt das:

HTML:
<!doctype html>
<html lang="de">
    <head>
        <meta charset="utf-8">
        <title>Titel der Seite</title>
        <meta name="description" content="Kleine Beschreibung der Seite.">
        <meta name="author" content="Wer hat es geschrieben...">
        <link rel="stylesheet" href="css/styles.css?v=1.0">
    </head>
    <body>
        <header>
            <nav>
                <!-- Inhalt hier... -->
            </nav>
        </header>
        <div>
            <!-- Inhalt hier... -->
        </div>
        <footer>
            <!-- Inhalt hier... -->
        </footer>
        <script src="js/scripts.js"></script>
    </body>
</html>
 
Pille1002 schrieb:
JQuery als JS Framework verwende ich bereits..
Also wird der dynamische austausch immer noch mit AJAX gemacht.
Dachte in denn ganzen Jahren hätte sich mehr getan ^^ und es gibt schon "fancyere" Möglichkeiten..

Dort hat sich schon mehr getan. Gibt mMn schon viel bessere Sachen als JQuery wie z.B. React oder Angular.

Angular von Google: https://angular.io/
React von Facebook: https://facebook.github.io/react/


Aktuell beschäftige ich mich mit React. React selbst ist nur für den DOM zuständig. Gibt viele Erweiterungen und ist alles Modular gehalten z.B. gibt es:
- React-Router für Single Page Apps wo man mehrere Seiten hat ohne die ganze Website neu zu Laden: https://reacttraining.com/react-router/
- Redux mit React-Redux "predictable state container" http://redux.js.org/

Und dann gibt es noch ein paar schöne UI Framesworks wie:
- http://www.material-ui.com/
- https://react.semantic-ui.com/
(Kannst ja mal durch die Beispiele klicken.)


Für Datenbanken Zugriffe gibt es auch GraphQL (auch Facebook) was meiner Meinung nach eine richtig gute Idee ist: http://graphql.org/learn/


Edit: Aber für den Einstieg ist das alles nichts. Wollte dir trotzdem mal ein Überblick geben.
 
Zuletzt bearbeitet:
Danke für den Überblick,

Angular JS2 ist mir ein Bergriff (Singe Page Seiten), hatte ich aber erstmal ausgeschlossen.
React ist mir nur vom Namen bekannt (schaue ich mir mal an).

@Kantico du beziehst dich auf die neuen HTML5 Tags, schau ich mir auch nochmals an..

danke !
 
spa ist die lösung.. da kannst du die üblichen evrdächtigen verwenden.. react, vue.js oder angular...
 
Nur um das vielleicht zu spezifizieren, was ist für dich eine Webanwendung?
 

Ähnliche Themen

Zurück
Oben