Tworzenie programu do tworzenia stron: init ()

(21 grudnia 2020 r.)

Kreatory stron to bardzo zaawansowane narzędzia tworzenie stron internetowych bez kodu. Możemy tworzyć strony internetowe za pomocą specjalnych bloków z narzędzia do tworzenia stron. Jako młodszy programista płacenie pieniędzy za inne narzędzie do tworzenia stron nie jest przydatne. Dlatego w tej serii artykułów utworzę własny program do tworzenia stron. Chodźmy!

Zdjęcie: Christopher Gower na Unsplash

Krok 1: Wybierz zależności!

Tworzenie programu do budowania stron od zera to bardzo okropny pomysł. Więcej czasu, łez i bólu szyi… Ten scenariusz jest straszniejszy niż horror.

GrapesJS i VueJS to potężniejsze frameworki i wystarczające dla mojego narzędzia do tworzenia stron .

Krok 2: Pobieranie!

W tym kroku muszę pobrać te frameworki.

GrapesJS

CDN

  • https://cdnjs.cloudflare.com/ajax/libs/grapesjs/0.12.17/grapes.min.js

  • https://cdnjs.cloudflare.com/ajax/libs/grapesjs/0.12.17/css/grapes.min.css

lub z npm

  • npm i grapesjs

VueJS

Wersja rozwojowa

 

Krok 3: Pierwsza konfiguracja!

Na tym etapie zainicjujemy nasz projekt za pomocą GrapesJS.

index.html

app.js

const editor = grapesjs.init({
// Indicate where to init the editor. You can also pass an HTMLElement
container: "#gjs",
// Get the content for the canvas directly from the element
// As an alternative we could use: `components: "

Hello World Component!

"`,
fromElement: true,
// Size of the editor
height: "300px",
width: "auto",
// Disable the storage manager for the moment
storageManager: false,
// Avoid any default panel
panels: { defaults: [] },
});

Będę kontynuował ten artykuł ……