Software Development

  JSON is an acronym for "JavaScript Object Notation" and it's a standardized way of formatting text data into a machine- and human-readable format. JSON-formatted text data looks like this: {     "username": "Max",     "age": 32,     "hobbies": ["Sports", "Cooking"],     "address": {       "city": "Munich",       "street: "Some street 5"     } } It's called "JavaScript Object Notation" because the formatting resembles the "look" and structure of objects in JavaScript code. Though, it's important to understand that you can work with JSON-formatted data in JavaScript (e.g. you can read or write a file that contains data in that format) BUT it's not JavaScript-exclusive. Instead, it's a very common data format for all kinds of use cases and it's usable in basically all programming languages. Again: The above snippet is some text (...

To access the web pages of any web application, you need a web server. The web server will handle all the HTTP requests for the web application e.g IIS is a web server for ASP.NET web applications and Apache is a web server for PHP or Java web applications. Node.js provides capabilities to create your own web server which will handle HTTP requests asynchronously. You can use IIS or Apache to run the Node.js web application but it is recommended to use the Node.js web server. Create Node.js Web Server Node.js makes it easy to create a simple web server that processes incoming requests asynchronously. The following example is a simple Node.js web server contained in a server.js file.

 HTTP response status codes indicate whether a specific HTTP request has been successfully completed. Responses are grouped into five classes:

 We need a programming language that can be executed on a server (i.e NOT in the browser ) What is a server?  in the end, just a regular computer  You can use basically ANY programming language on the server Python  PHP  C# Java NodeJs(JavaScript). High-performance js  Getting started with Node js  Installing & running Nodejs What is? A javascript Runtime  A tool for executing JavaScript code (outside of the browser) Can be installed on any computer and hence be used to write and execute  https://nodejs.org/en/ Working with the Command line  

  Js life and interactivity  Beyond The Frontend  What is Backend? How Does The web Work? Static websites are sites that consist of only HTML, CSS & JavaScript. Of course, the browser always receives just HTML, CSS & JavaScript - that's all the browser knows to parse and handle. But a website might need more than that to work correctly! Specifically, as you learned in the previous lecture, you might need server-side code in addition, to handling requests that contain data (e.g. form data) or generating different HTML responses for different visitors. If you have a website that does require such server-side code in addition to the HTML, CSS & JavaScript instructions that might be sent to the browser, you have a so-called "Dynamic Website" (instead of a "Static Site"). "Dynamic" because the generated HTML code is not always the same. Browser Instructions: HTML, CSS & JavaScript  Option A Write the instructions (ie HTML, CSS, and JavaScrip...

 Parallax scrolling is a technique in computer graphics where background images move past the camera more slowly than foreground images, creating an illusion of depth in a 2D scene of distance. Simple parallax

 Tailwind CSS works by scanning all of your HTML files, JavaScript components, and any other templates for class names, generating the corresponding styles, and then writing them to a static CSS file. It's fast, flexible, and reliable — with zero runtime. https://tailwindcss.com/ 

 https://getbootstrap.com/docs/5.2/getting-started/introduction/   Build fast, responsive sites with Bootstrap Powerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize a prebuilt grid system and components, and bring projects to life with powerful JavaScript plugins.

 As a Web Developer, you will typically write more CSS and JavaScript code than HTML code. What & Why  You can write all the CSS / JS code on your own  But often, you have certain features, styles, or tasks that are very common to a lot of projects Default styles  Image Carousel  Parallax Effect   Third-party packages "provide" ready-to-use code that you can add to your projects and sites Popular CSS Packages & use-cases Boostrap  A very popular CSS framework (package) that provides dozens of pre-built component styles (eg buttons, alerts, etc) Material UI  A popular CSS framework (package) that provides dozens of pre-built component styles(eg buttons, alerts, etc) which follow the Material design specification by google Tailwind CSS A popular CSS framework (package) that provides dozens of pre-build utility styles which you can combine to style your HTML code without writing (a lot of ) custom CSS code. Popular Javascript Packages ...

 CONFIGURE PLAYER NAMES  form with an input field in the modal overlay; also validate user input and show validation feedback  (Re-) Start Game  start game button should clear  Turn-based Gameplay  Turns switch automatically between the two players, every player has his or her own symbol Select fields & Check for winners  Game fields are clickable & the player's symbol is displayed; check for the winner's regular tic-tack-toe rules. Show gem over a window