Видео 88
Просмотров 7 741

1:43

Mongoose 1 - koppla ihop databas, skapa schema, skriva och läsa från samling

16:32

Enkel meny med flex (webb1)

4:31

Git med Github Desktop, VS Code och Codespaces

21:33

Enkel sidopanel med JS

28:47

Bloggen steg-för-steg (webb1)

1:47:32

Express, Pug, Mongoose och MongoDB

Från ett tomt projekt till en fungerade webbsajt som läser data från databasen och med formulär som kan lägga till och ändra i databasen.
En del av kursen webbserverprogrammering 1.
00:00 Installera express mm via npm
00:39 Skapa en server och en rutt
02:40 Morgan, statiska filer och formulärstöd
03:35 Pug som view engine och ange mapp views
04:00 Skapa mappstruktur
04:19 Skapa vyn index
04:45 Öppna portar och testa /
05:14 Rendera vyn index
05:40 Rendera vyn index med data
06:36 Koppla mongoose mot MongoDB Atlas
08:25 Skapa schema och model Thing
12:04 Använda modellen Thing
13:53 Skapa en Thing via MongoDB extension
16:05 Skapa vy things/index
20:11 Skapa vy thing/new för att lägga till ny
23:10 Skapa...

Видео

1:43

mongodb-extension

Просмотров 3821 день назад

En mycket snabb genomgång på hur man kan använda en extension till VS Code från MongoDB själva för att kunna jobba med sin databas direkt i VS Code. En del i kursen Webbserverprogrammering 1 på Berzeliusskolan. 00:00 Marker 1 00:15 Koppla extension till Atlas 00:35 Databaser och collections 00:47 Visa alla i en Collection 00:56 Redigera och spara Document 01:15 Insert Document

Mongoose 1 - koppla ihop databas, skapa schema, skriva och läsa från samling

16:32

Mongoose 1 - koppla ihop databas, skapa schema, skriva och läsa från samling

Просмотров 10721 день назад

Vi utgår från ett grundskelett med node express. Vi har även installerat morgan och pug och bekräftat att de fungerar med en enkel rutt, samt aktiverat stöd för statiska filer och data från formulär i body. 00:00 Introduction 02:46 Skapa modell och bekräfta 04:15 Ta in modellen 04:42 Visa alla 07:04 Lägga till 13:09 Rendera med Pug I nästa video kommer jag skapa formuläret för att lägga till, v...

4:31

Enkel meny med flex (webb1)

Просмотров 48Месяц назад

Hur man enkelt bygger en meny med flex enligt god praxis med nav, ul, li och a. Hur man gör motsvarande med grid: ruclips.net/video/c6FUQgeLWUQ/видео.html Inspelad 2024-11-12 som en del av kursen Webbutveckling 1 på Berzan.

Git med Github Desktop, VS Code och Codespaces

21:33

Git med Github Desktop, VS Code och Codespaces

Просмотров 583 месяца назад

Video för kursen webb1 på Berzan 00:00 Installera Github Desktop på skoldatorerna 01:16 Github Desktop 02:38 Ändra filer och göra commit och push 05:21 Se dina ändringar på Github 05:46 Jobba i VS Code 06:18 Koda HTML-skelettet och testa 07:37 Bra setup med fönster för att koda 08:26 Koda CSS och koppla samman 09:33 En första commit på riktigt via Github Desktop 09:58 LiveServer (extension) 11:...

28:47

Enkel sidopanel med JS

Просмотров 1529 месяцев назад

Hur man kan skapa en enkel sidopanel eller mobilmeny. Exemplet kan lätt byggas om för att passa din meny. Menyn byggs i html med semantiska taggar och onumrerad lista enligt god praxis. Animationen görs med klasser i css och placeringen med position. Själva menyns visning triggas genom att toggla klasser med js. Glömde lägga med i videon kring att det inte ska gå att klicka på länkarna när den ...

1:47:32

Bloggen steg-för-steg (webb1)

Просмотров 98Год назад

Jag kodar uppgiften Blogg i webbutveckling 1 som innebär att ta en sida från mobilversion till responsiv. 0:00 Introduktion och målbild 0:39 Grundskelett html, reset och wrapper 6:25 Header med logo och ikoner 7:16 Ikoner från FontAwesome 15:45 Typsnitt från Google Fonts 20:28 Den tunna röda linjen 21:53 Sektionen Berzan är vårt ideal 26:52 Röda knappar 1:12:12 Responsivt med media query för pl...

34:56

9.3 Refaktorisera Pong

Просмотров 432 года назад

Jag demonstrerar hur man kan refaktorisera Pong till att ha klasser. Del i programmering 1 med js 22/23 vid Berzeliusskolan i Linköping.

Rich Text med ckeditor och HTML Purifier (orig)

26:48

Rich Text med ckeditor och HTML Purifier (orig)

Просмотров 682 года назад

Rich Text med ckeditor och HTML Purifier (orig)

26:48

Rich Text med ckeditor och HTML Purifier

Просмотров 272 года назад

Idag förväntar vi oss att kunna redigera text och själva skapa rubriker etc på en webbsida. Bloggar bygger helt enkelt på det. Så för att göra det så får vi ta en in en Rich Text Editor. Vi väljer ckeditor då den är uppdaterad och enkelt att arbeta med. Vi måste dock säkra upp så att vi enbart släpper igenom de taggar vi vill när vi lagrar i databasen så därför behöver vi tvätta på php-sidan oc...

Menu med oordnad lista för mobilt och desktop (weuweb01)

40:25

Menu med oordnad lista för mobilt och desktop (weuweb01)

Просмотров 1302 года назад

Vi skapar en meny i html med nav och oordnad lista, stylar css utifrån mobile first och lägger sedan till media queries för desktop. Slutligen gör vi mobilversionen till en riktig mobilmeny som ligger ovanpå annan innehåll och öppnas och stängs med javascript. 00:00 Intro 01:54 Koda struktur i html 06:06 Styla mobil med css 12:28 Styla desktop med css 16:00 Börja med js

41:57

Routning med SimpleRouter

Просмотров 692 года назад

Routning med SimpleRouter

Validering, filtrering och meddelanden Books 13

34:57

Validering, filtrering och meddelanden Books 13

Просмотров 393 года назад

Det är dags att säkra upp så att vi både slipper felmeddelanden och ser till att den data vi lagrar är korrekt. Vi validerar och filtrerar vår indata med filter_input och säkrar upp så att utdatan är escejpad. Längs vägen skriver vi hjälpfunktionerna redirect, redirectHome och redirectPrevious, vilka vi redan nu har stor nytta av. Funktionen redirectPrevious blev lite fel då den självklart inte...

9:48

SQL injektion Books 14

Просмотров 113 года назад

Vi har egentligen redan skyddatt oss mot SQL-injektion men vi tar reda på hur både filter och parametriserad sql skyddar oss. Vi demonstrerar enkla attacker och vad som gör dem möjliga. 00:00 - Introduktion 00:32 - Deaktivera filtrering av indata 00:55 - Omarbetning till enkel sql-sats utan parametrar 04:00 - Exempel på osäker kod 04:50 - Effekten av osäker kod 06:00 - Skydd genom filter 07:00 ...

4:49

Refaktorera med funktioner (Books 12)

Просмотров 153 года назад

Vi tar vår mycket enkla kod och bryter ut kopplingen till databasen för att kunna återanvända den helt enkelt och få lite snyggare och mer lättläst kod. En refaktorisering ändrar inte funktionalitet då den enbart gör saker bättre under huven - vi förbättrar vår kod så den gör samma sak fast effektivare och snyggare. Producerad 2021-11 av Johan Kellén till kursen webbserverprogrammering 1. Windo...