create-web

Create a website

By Client–server model

• Front-end (client side):

  • HTML (Hyper Text Markup Language)
  • CSS (Cascadian Style Sheet)
  • JS (Javascript)

• Back-end (server side):

  • PHP (PHP: Hypertext Preprocessor)
  • Python
  • C#
  • C++
  • Javascript
  • Java
  • Bash

Web browsers only show websites (HTML, CSS, JS) and has an integrated JS engine. In the backend you can use any language that the server machine can compile.

Methods to create a website

Traditional method

Use the Trinity (HTML, CSS, JS) in the frontend and write the backend in PHP with SQL (TSQl, MySQL) to connect to the database management system running a web server on a machine.

Modern methods, web framework

• Front-end frameworks

  • React: JavaScript library for building user interfaces
    • Next.js: for building server-rendered and client-rendered React apps
  • Angular: for building complex and feature-rich apps with Typescript
  • Vue.js: for building user interfaces and apps with JS

• Back-end frameworks

  • NestJS: JS framework for building RESTful APIs, microservices and backend apps
  • Django: high-level Python framework
  • Express.js: web framework for Node.js
  • Ruby on rails: web framework for the Ruby

• Full-stack frameworks

  • Laravel: PHP framework with Model-View-Controller
  • Meteor: full-stack JavaScript framework
  • Spring Framework: Java-based framework
  • ASP.NET: framework for building web apps and services with .NET and C#
  • Nuxt JS: VUe full-stack framework for web apps

• Static-Site-Generators (SSG)

  • Docsify: SSG written in JS
  • Hexo: a fast, simple & powerful blog framework
  • HUGO: SSG written in Go
  • Jekyll: SSG written in Ruby
  • Gatsby: SSG that uses React and GraphQL.
  • docusaurus
  • Hexo

• Content Management System (CMS)

  • WordPress: Popular and user-friendly blogging platform.
  • Joomla: Flexible and balanced CMS.
  • Drupal: Powerful and versatile CMS for complex projects.
  • Prestashop: CMS for ecommerce
  • Shopify: CMS for ecommerce
  • Moodle: CMS for learning management systems
  • Headless CMS: Directus.io, dotCMS, Ghost.org, strapi.io, Tina.io

By Database use

• Without database (static website):

  • Only HTML, CSS, JS

• With database (dynamic website):

  • Relational database management system (RDBMS): SQL (MariadDb, MySQL, PostgresSQL)
  • No relational (with API): httpie.io, postman, solo.io, Sequin.io, Bartkessels Getit, Apollo Graph QL

References

• Browser engine
• Document Object Model (DOM)
• Javascript engine
• V8 (Javascript engine)
• OSI model - Wikipedia
• Jamstack