• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Organizacja plików HTML, CSS, JS

VPS Starter Arubacloud
+1 głos
1,231 wizyt
pytanie zadane 1 września 2017 w HTML i CSS przez emopees Nowicjusz (210 p.)
Witam wszystkich!

Pracuję nad bardzo dużym projektem, jest to portal ogłoszeń. Chciałbym Was podpytać jakie macie sposoby na organizację plików?

Aktualnie mam bardzo dużo podstron HTML, docelowo będzie ich około 60, do każdej wspólne style + własne.

Czy wrzucacie wszystko w 1 folder czy każdy dział do osobnego podfolderu? Wtedy znów przy zmianie katalogu, hiperłącza wymagają zmian w każdym HTML, co może być męczące.

Jeśli macie sprawdzone rozwiązania, to chętnie przetestuję, bo Google niewiele o tym pisze :)

Pozdrawiam!

2 odpowiedzi

0 głosów
odpowiedź 1 września 2017 przez JuzMnieTuNieMa Użytkownik (690 p.)
edycja 1 września 2017 przez JuzMnieTuNieMa
 
Najlepsza

Witam.

Zwykle gdy pracuję nad jakimś większym projektem to robię tak:

  • w głównym folderze projektu mam tylko index.html i foldery: html, css, js, img (i .git jak robię z GitHubem)
  • w folderze css mam 2 foldery: dzielone (np. css na ogólne style) i pojedyncze (np. layout poszczególnych podstron). To samo w folderze js.
  • w folderze img mam 2 foldery: zdjęcia i inne (np. favikona, tło, itp) ale znów możesz zrobić dzielone i pojedyncze

Drzewko plików wygląda wtedy mniej więcej tak (nazwy plików oczywiście jak uznasz, jak lepiej pasuje do projektu):

  • index.html
  • html
    • podstrona1.html
    • podstrona2.html
    • podstrona3.html
  • css
    • dzielone
      • style.css
      • layout.css
    • pojedyncze
      • podstrona1-css.css
      • podstrona2-css.css
      • podstrona3-css.css
  • js
    • dzielone
      • skrypt.js
    • pojedyncze
      • podstrona1-js.js
      • podstrona2-js.js
      • podstrona3-js.js
  • img
    • zdjęcia
      • zdjęcie1.jpg
      • zdjęcie2.jpg
      • zdjęcie3.jpg
    • inne
      • favikonka.ico
      • tło.png
      • itp.

 

Możnaby też zrobić coś takiego:

  • w głównym folderze projektu mam tylko index.html i foldery: podstrony, css, js, img
  • w folderze css pliki współdzielone przez wszystkie podstrony, chyba że miałby to być tylko 1 arkusz stylów to wtedy dałbym ten plik bezpośrednio do głównego folderu i nie robił folderu css. To samo z js
  • w folderze podstrony tyle folderów ile ma być podstron
  • w tych folderach umieścić pliki css, js i img, luzem albo w swoich folderach

Drzewko plików:

  • index.html
  • style.css
  • skrypt.js
  • podstrony
    • podstrona1 (bez podfolderów)
      • podstrona1.html
      • style.css
      • skrypt.js
      • zdjęcie1.jpg
      • zdjęcie2.jpg
      • zdjęcie3.jpg
    • podstrona2 (z podfolderami)
      • podstrona2.html
      • css
        • style.css
        • layout.css
      • js
        • skrypt1.js
        • skrypt2.js
      • img
        • zdjęcie1.jpg
        • zdjęcie1.jpg
        • zdjęcie1.jpg
    • (dalsze podstrony)

Takie podejście wydaje mi się jednak nieco nadmierne i bardzo nieelastyczne. Gdybyś chciał/chiała (przepraszam nie umiem z nicku wywnoskować) zmienić trochę drzewko plików to trzeba będzie zmienić to we wszystkich folderach (a ma ich być dużo). Jednak wybór należy do Ciebie.

Mam nadzieję że pomogłem. Czekam rówież na inne odpowiedzi, może sam się czegoś nauczę :)

Pozdrawiam.

komentarz 1 września 2017 przez rafal.budzis Szeryf (85,260 p.)
Co robisz gdy chcesz coś zmienić w menu ? Używałeś kiedyś gulpa ? Jeśli chcecie mogę rozwinąć moją wypowiedź.
komentarz 1 września 2017 przez emopees Nowicjusz (210 p.)
Dziękuję za odpowiedź! O coś takiego mi chodziło, wiem że trzeba będzie to rozwinąć jak piszę kolego o Gulpa ale na razie i na początek wystarczy :)
0 głosów
odpowiedź 1 września 2017 przez rafal.budzis Szeryf (85,260 p.)
edycja 1 września 2017 przez rafal.budzis
PHP i instrukcja require (tyle starczy na początek)

lub GULP i gulp-include, i inne gulpy do minifikowania JS, CSS i HTML.

Pozwala to na wyciągniecie elementów wspólnych np menu, stopki do osobnych plików wtedy zmieniasz linki w jednym pliku i masz ;)

Ogólnie to polecam poczytać o gulpie ;)
komentarz 1 września 2017 przez Mariusz08 Maniak (62,300 p.)

PHP i instrukcja include

A ja polecam poczytać o require. 

komentarz 1 września 2017 przez rafal.budzis Szeryf (85,260 p.)

@Mariusz08 Ok zmieniłem jeśli ci na tym zależy.

komentarz 1 września 2017 przez emopees Nowicjusz (210 p.)
Dzięki wielkie, czytałem o Gulpie i jak bardzo usprawnia pracę, dlatego znajdę jakiś tutorial i zbadam co potrafi :)

Podobne pytania

0 głosów
1 odpowiedź 699 wizyt
0 głosów
1 odpowiedź 91 wizyt
0 głosów
1 odpowiedź 1,165 wizyt

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...