Node SASS

Om du vill generera css från en scss sass fil

npx sass --style compressed <fil>.scss > style.css

Du kan även använda dig av node-sass tool. Om du har svårt att installera nodejs se denna guild: Installera nodejs utan root på ett webbhotell

Shared hosting

Om du använder dig av ett webbhotell som inte har nodejs så kan du lägga till det själv utan att vara root. Många använder Siteground som inte har nodejs och då finns denna lösning. Börja med att hitta rätt version här https://nodejs.org/dist/.

cd ~ wget -qO- https://nodejs.org/dist/v14.8.0/node-v14.8.0-linux-x64.tar.xz | tar -Jvx mv node-* nodejs; mkdir bin; cp nodejs/bin/node bin; cd bin ln -s ../nodejs/lib/node_modules/npm/bin/npm-cli.js npm ln -s ../nodejs/lib/node_modules/npm/bin/npx-cli.js npx; cd ..

Om du inte har $HOME/bin i din path så får du lägga till detta i den .profile.

Felsökning

I många fall så har man inte tillgång till serversidan när du har webbhotell. Då kan det vara smidigt att felsöka variabler som du har i .htaccess. Det man behöver göra är att dumpa en del av informationen som mod_rewrite använder till url-fältet så man kan läsa informationen.

Här ser ni ett exempel på detta i .htaccess filen.

RewriteCond %{QUERY_STRING} !dump RewriteRule (.*) http://www.minegenexempeldoman.se/$1?dump&the-request=%{THE_REQUEST}&http-host=%{HTTP_HOST} [R=302,L,QSA]

Byt ut www.minegenexempeldoman.se mot den domänen du har.

Om ni behöver exempel på variabler som Apache så finner ni det här.

Vad använder du för Content Management System?

Som utvecklare så är det ganska lätt att ta reda på vilket system en webbsida kör i botten. Men man kan alltid göra det lättare genom att använda Builtwith och Whatcms.

Vad är Git

Git är ett versionshanteringsprogram som skapades 2005 för att hantera källkoden till Linuxkärnan. Linus Torvalds ansåg att inget av de alternativ som fanns att tillgå räckte till vad gäller funktion eller prestanda. Han hade länge använt ett kommersiellt system (BitKeeper), men förlorat gratislicensen efter en kontrovers. Själv använder jag git för alla mina projekt sedan några år tillbaka.

Git är ett distribuerat versionshanteringssystem, vilket innebär att ett centralt arkiv saknas, och att vem som helst kan skapa en egen kopia. Vissa arkiv kan sägas vara viktigare än andra, till exempel det arkiv där den officiella Linuxversionen publiceras, men det är inte av tekniska skäl utan rent sociala konventioner.

Git är uppbyggt för att passa arbetsmetodiken i stora öppen-källkods-projekt. Därför finns det program för att skicka och ta emot ändringar i form av patchar via e-post, samt logga vem som gjort vad utan att någon behöver administrera register över utvecklare. Versioner identifieras med hjälp av starka kryptoalgoritmer (SHA-1) och kan därför signeras digitalt om så önskas, även om versionsidentifikationen i sig i praktiken skyddar mot manipulation. Därtill är Git extremt snabbt för att kunna hantera den stora volymen källkod och ändringar som linuxkärnan kräver.

Git är i grunden kommandoradbaserat (CLI). Det finns även tillägg (plugins) till vanliga utvecklingsverktyg som gör det möjligt att använda Git inifrån det aktuella verktyget - exempelvis EGit. Det finns även separata verktyg med grafiska användargränssnitt (GUI) som kan utnyttjas för att använda Git - exempelvis TortoiseGit och gitk.

Det finns flera verktyg som underlättar övergång från eller parallellhantering jämte andra versionshanterare såsom CVS eller Subversion som jag också har använt förut. Det finns också verktyg för att simulera en CVS-server.

Läs mer om Git.

Vad är Github

Github är ett webbhotell för mjukvaruutvecklingsprojekt som använder versionshanteringssystemet Git. Github erbjuder både abonnemang mot avgift för privat bruk och gratis lagring för mjukvaruprojekt med öppen källkod. I maj 2011 utsågs Github till det populäraste webbhotellet för lagring av öppen källkod, och gick därmed om konkurrenterna Sourceforge och Google Code.

Eftersom projekt som Github finns så är det helt gratis att komma igång med att utveckla och använda git. När man pratar utveckling så är det A och O att man har koll på sin kod och även kan backa till tidigare versioner.

Det finns självklart mycket att veta om git men här har vi en början iallafall 🙂

När man utvecklar en hemsida så måste man tänka på strukturerad data och sökmotoroptimering för att man ska lyckas och ha rätt information.

Här har ni Googles testverktyg för strukturerad data. Mycket bra för att se vad för information som finns och saknas på en hemsida. Man kan hämta vilken sida som helst eller vara lägga in vilken kod man vill.

Vad är Dibs?

DIBS gör det enkelt och säkert att ta betalt på nätet när du har en e-handel. Dibs erbjuder fler än 40 betalsätt och funkar för stora delar av världen. Om du vill använda Dibs för din e-handel så måste man ha ett avtal med Dibs samt följa deras regler ifall en site inspektion ska gå igenom.

DIBS_logo_blue_RGB.jpg

Att tänka på

Se till att ha senaste versionen av Dibs modulen. Kolla under releases för att få stable. Veta kontouppgifter till sitt Dibskonto. Att använda loggor och ha villkor på checkout sidan är nödvändigt. Kolla in Dibs tech hjälp. Att ha villkor, telefonnummer, e-post och leveranstid i orderbekräftelsen. Känna till kortuppgifter för test Inget krav på att ha en logga i botten på sidan. Har man dock en så måste den vara rätt och länka till www.dibs.se.

Dibs kontaktinformation för kundtjänst

Öppettider vardagar: 9 - 17
Sverige: +46 8-527 525 00
Norge: +47 2155 4400
Danmark: +45 7020 3077

Testuppgifter för kort

Visa
4711100000000000
06/24
684

Hitta mer uppgifter om kort här.

När man har fixat allt som krävs så ska man skicka ett mail till: [email protected]

Om du vill veta hur man gör Hello World på olika språk / ramverk så har jag lite exempel här. Detta kan vara bra ifall man vill komma igång att börja programmera 🙂

sdn-programing-api.jpg

Bash

#!/bin/bash echo "Hello, World!"

C

#include <stdio.h> void main() { printf("Hello World"); }

Node.js ramverk (JavaScript)

#!/usr/bin/env node console.log("Hello, World!");

Perl

#!/usr/bin/env perl use strict; use warnings; print "Hello, World!"

PHP

#!/usr/bin/php -q print("Hello, World!");

Python

#!/usr/bin/env python print "Hello, World!"

Har jag glömt ditt favoritspråk så säg till. Det finns så många språk där ute 😉

Ibland så vill man veta mer information om en domän som man ska köpa. Det kan vara av ren nyfikenhet eller bara att man vill kunna få tag på gammal kontaktinformation som inte längre finns kvar.

Internetarkivet spara små skärmdumpar genom tiden för nästan alla webbplatser. Detta gör det möjligt att se vad som fanns innan du hade din webbsida. Ibland är man först med ett domännamn och ibland så är det många andra som haft namnet innan dig.

Använd detta för ditt arbete eller bara för kul. Detta är något som alla bör veta om 😉

Förbättra din sökmotoroptimering

Detta är bra ifall du vill omdirigera alla icke-www förfrågningar till www-versionen av din webbsida. Det du behöver göra är att lägga till följande kod i din .htaccess-fil.

301-redirect-htaccess-non-www-to-www.jpg

RewriteEngine On
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

Detta kommer att omdirigera alla som försöker besöka http://din-sida.se till http://www.din-sida.se

Det finns flera fördelar att göra detta

Undviker att det blir dubbletter i Google. Du kommer undvika risken för delad sidrankning och delad länk-popularitet (inkommande länkar). Det är trevligare och mer konsekvent.

Om du vill göra det motsatta och tycker att icke-www är snyggare så gör du detta istället.

RewriteEngine On
RewriteCond %{HTTP_HOST} !^min-sida\.se$ [NC]
RewriteRule ^(.*)$ http://min-sida.se/$1 [R=301,L]

Själv så föredrar jag www eftersom jag tycker att det är en standard men det är upp till dig att välja. I detta fall så måste du komma ihåg att ändra "din-sida.se" till ditt domännamn 😉

PHP Webbserver

Ibland så vill man snabbt testa PHP-kod som man skrivit utan att behöva sätta upp en webbserver lokalt. Tänkte tipsa om denna smidiga lösning som inte alla PHP-utvecklare känner till.

PHP_Logo.png

Det ända man behöver är PHP och inget annat. Kör detta kommando för att få en server på http://127.0.0.1:8080

php -S 127.0.0.1:8080 -t <Sökväg till projektkatalogen>

Vill du att andra datorer i ditt nätverk skall komma år din lokala server så kan du skriva

php -S 0.0.0.0:8080 -t <Sökväg till projektkatalogen>

Om du inte startar serven som superanvändare så kan du inte använda portar under 1024. Men vill du ej ange ett portnummer så kan du köra detta som superanvändare och få det på vilken port du vill.

För mer information om detta: Inbyggd webbserver.

Google Sök

Meddelandet Denna webbplats kan ha blivit hackad visas när Google tror att en hackare kan ha ändrat sidor på en webbplats eller lagt till nya sidor med spam. Om du besöker webbplatsen kan du omdirigeras till webbplatser med spam eller skadlig programvara.

En sida som du har hittat via Google sök

Jag rekommenderar starkt att du inte besöker webbplatsen förrän meddelandet försvinner från sökresultatet. Speciellt om du kör Windows som lätt blir infekterat av virus.

Din webbplats

Meddelandet Denna webbplats kan ha blivit hackad tas inte bort förrän den webbansvariga vidtar åtgärder.

Detta behöver göras för att åtgärda problemet

Registrera och verifiera webbplatsen i Googles Search Console. Logga in på Search Console och titta i avsnittet Säkerhetsproblem där det finns exempel på webbadresser som kan ha blivit hackade. Åtgärda säkerhetsproblemet som gjorde att din webbplats blev infekterad. Annars är risken stor att den smittas igen. Läs Googles resurser om hackade webbplatser om du vill veta mer om hur du åtgärdar problem på webbplatsen. När hela webbplatsen är åtgärdad och säker igen ber du om en granskning i avsnittet Säkerhetsproblem i Search Console. När vi har kontrollerat att webbplatsen har åtgärdats tar vi bort meddelandet om att den har blivit hackad.

Lätt när man vet hur man gör va?

WP-config

Utvecklarna av Wordpress har gjort ett medvetet beslut att göra det möjligt för automatiska uppdateringar för mindre uppdateringar och översättnings-filer. Detta är det bästa sättet att garantera att din webbplats hålls uppdaterad och att inaktivera automatiska uppdateringar avrådes.

För att helt stänga av alla typer av automatiska uppdateringar.

define( 'AUTOMATIC_UPDATER_DISABLED', true );

Detta kan vara bra ifall du vet exakt vad du gör och håller koll själv. Mer information om detta!

Functions.php

Om du bara vill få bort alla notifikationer så kan du lägga in dessa rader i ditt projekt.

Detta stoppar e-postmeddelanden som skickas till dig efter en automatisk uppdatering.

add_filter( 'auto_core_update_send_email', '__return_false' );

Detta stoppar e-postmeddelanden som skickas till dig för att informera om en kärnuppdatering.

add_filter( 'send_core_update_notification_email', '__return_false' );

Bra information för er som vill veta hur saker och ting fungerar 😉

Om man är en webbutvecklare så älskar man oftast nya funktioner och stöd för den senaste webbtekniken. Ett problem är oftast att vissa funktioner inte stöds i alla webbläsare och då måste man överväga vad man kan ha med och vad man kan ta bort.

Jag är själv ett stort fan av Googles webbläsare Chrome men sidorna måste faktiskt fungera i anda webbläsare med. Med detta sagt så vill jag tipsa om tjänsten Caniuse som löser detta problem. Det är bara att skriva in olika termer som tex CSS3 eller svg så får du en fin sammanställning på vad som stöds och i vilka versioner 😉

Punycode

Man har länge kunnat ha svenska tecken som å, ä och ö i domännamnet. Dock så är det inte alla domäner som stödjer detta. Det kan vara roligt men det är bra att veta lite om hur det fungerar, för det kan ställa till det om man inte har koll. Ett vanligt problem kan vara när man försöker matcha på ett domännamn med åäö för att vidarebefordra till en annan domän.

Det här gäller även accenter

När du skriver å, ä eller ö i ett domännamn så är det inte det namnet som egentligen används. Det finns något som kallas Punycode som är en standard som gäller på Internet. Här är några exempel på hur det ser ut efter att man har konverterat till Punycode.

båtar.se -> xn--btar-qoa.se hästar.se -> xn--hstar-gra.se öland.se -> xn--land-4qa.se räksmörgås.se -> xn--rksmrgs-5wao1o.se

Det lättaste sättet är att använda en konverter på nätet för att göra om adresser till det rätta när det behövs. Jag brukar använda mig av punycoder.com men det finns många på webben att välja ifrån.

Lösenord för hemsidan

Här kommer lite information om lösenordsskydd för din hemsida. Detta är användbart ifall du vill skydda din hemsida temporärt eller om du utvecklar den.

Informationen på denna sida utgår från att du kan lite om att konfigurera webbservrar. Om detta känns svårt så kan du alltid anlita mig för att lösa detta åt dig.

1462-2.png

Introduktion

Att skydda information eller din hemsida med lösenord är något som är mycket vanligt och som de flesta har ett behov av någon gång. Oavsett ifall du har något hemligt som du vill skydda eller bara något under utveckling som inte är klart. Vi kommer prata om två olika filer som du behöver känna till: .htaccess och .htpasswd.

.htaccess

Htaccess är en förkortning för Hypertext Access. Det är en konfigurationsfil som används av apache-baserade webbservrar. Konfigurationsfiler konfigurerar de initiala inställningarna för ett program, eller i detta fall servern. Detta betyder att .htaccess-filen kan användas för att få servern att fungera på ett visst sätt. Varje funktion är i praktiken bara en rad av text, eller kod, som säger till servern vad den ska göra. Du kan lägga till eller ändra funktion genom att lägga till eller ändra koden i .htaccess-filen.

Det finns många anvädningsområden för en .htaccess-fil

Skydda din sida med ett lösenord. Skapa en anpassad felsida. Omdirigera besökare till en annan sida. .htpasswd

För att kunna lösenordsskydda din hemsida så behöver du även en .htpasswd-fil. Denna fil består av dina användare och lösenord som ska användas för att komma åt din hemsida.

Hur gör man

Lägg in detta i din .htaccess-fil. Denna fil ska ligga i din webbroot.

AuthName "Min skyddade hemsida" AuthType Basic AuthUserFile /absolutsökväg/till/filen/.htpasswd Require valid-user

Skapa dina lösenord via kommando eller någon hemsida. Sedan lägger du bara in det i .htpasswd-filen

mittkonto:$apr1$f2JL78bW$u4H37Cw6JdPUOp2ZSncug.

Om du nu har gjort rätt så ska du behöva skriva ett lösenord för att komma åt din hemsida. Om du gillar terminaler så kan du skapa .htpasswd filen genom att köra kommandot htpasswd.

htpasswd -c /absolutsökväg/till/filen/.htpasswd mittkonto

Skönt att man har möjlighet att sätta lösenord 😉

Loopia

Om du har problem med cachen hos Loopia så kan du se hit. Cache är något som är väldigt bra men inte när man ska utveckla sin hemsida. Det är mer än en gång man har funderat på varför inte sakerna man gör förändrar något och kommit på att: fan det är cachen igen

Du behöver skapa eller modifiera din .htaccess fil

Header set Cache-Control no-cache

Eller detta, ifall du vill ha mer inställningar

Header set Cache-Control "max-age=0, private, no-cache, no-store, must-revalidate"

Eller detta, om du bara arbetar med css-filer

SetEnvIf Request_URI "^.*\.css$" NO_CACHE Header set Cache-Control no-cache env=NO_CACHE

Med dessa inställningar så kommer du alltid att få det senaste. Observera att du inte skall köra detta under produktion för då vill man ha cache.

Mer information om dett hittar du här: Varnish

DNS

Här hittar du några bra hemsidor för DNS relaterade saker. Det är bra att ha lite verktyg att leka med.

dns.jpg

Hemsidor för att testa DNS-förändringar Check Host Ceipam DNS Unlimited Just-Ping Nexcess Site24x7 WhatsMyDNS DNSSEC Test DNSViz Verisign Labs' DNS Analyzer

Hoppas ni får användning av detta 😉

Vad är cookies?

En cookie är en textfil som vid uppkoppling mot en webbplats sparas på och vid senare besök, hämtas från, besökarens dator eller datorliknande enheter t.ex. mobiltelefoner. Cookien sparas i anslutning till de filer som används av datorns webbläsare eller motsvarande program.

Datoranvändaren kan enkelt ta del av, blockera och avlägsna lagrade cookies om så önskas. Det är mycket vanligt att webbplatser använder cookies eftersom de ofta används till grundläggande funktioner.

Den Intressebaserade anpassning som görs är mycket betydelsefull för användarupplevelsen av Internet. Den reklam användaren exponeras mot blir typiskt sett mer relevant för denne.

Det ökade värdet av den Intressebaserade reklamen bidrar i hög utsträckning till att attraktiva tjänster kan finansieras med reklam i stället för avgifter.

Cookies har många användningsområden. Några exempel är:

Lagra inställningar för hur en webbplats ska visas (upplösning, språk etc) Koppla på kryptering av överföring på internet av känslig information Möjliggöra observation av hur användare tillgodogör sig webbplatsen och därmed samla underlag för hur webbplatsen generellt kan utvecklas

koppla användarens exponering för reklam på webbplatser till dennes transaktioner i e-handeln som underlag för beräkning av ersättningar till webbplatsen och annonsnätverken

samla information om användares beteenden för att anpassa och begränsa innehållet och reklamen på besökta webbplatser till dessa beteenden.

Cookies används på flera olika sätt inom reklam

Mycket innehåll på Internet är gratis eftersom den finansieras av reklam. Cookies bidrar bland annat till att webbplatser gör den reklam du ser mer relevant.

En ytterligare fördel är att reklamen kan begränsas i frekvens till varje användare. En banner visas till exempel bara fem gånger för varje användare. Detta kan endast fungera med hjälp av cookies. När en förutbestämd gräns nås, kommer reklamen inte visas längre, och en annan annons kommer att visas istället.

En annan möjlig strategi för att anpassa budskapet är intressebaserad reklam. Återigen krävs cookies: Olika användare ser olika annonser – beroende på innehållet på de webbsidor som användaren har besökt. På detta sätt ges mer relevanta annonser.

En person som ofta använder receptsidor men aldrig bilsidor får mer mat- än bilreklam. Kommersiella leverantörer träffar en bättre målgrupp och du som användarna får färre irrelevanta annonser.

Cookiehantering

Som användare kan du själv bestämma om du vill acceptera eller ta bort cookies. Du kan även välja att tilllåta cookies för specifika webbsidor. Dessa val går att göra i inställningarna för din webläsare.

Observera att detta är inte ett sätt att slippa reklam på webbplatser utan det kommer att visas samma mängd reklam och reklamen kan bli mindre relevant för användaren.

Om man inte accepterar cookies kan det också leda till att viss information på webbplatsen inte blir tillgänglig.

Om du väljer bort cookies i din webbläsare kommer det endast gäller för den webbläsare du använder. Du kommer att behöva följa samma process på alla olika webbläsare du använder på samma och/eller olika datorer eller enheter. Observera att om det finns separata användarkonton på en dator i ett hushåll har du möjlighet att skräddarsy dina inställningar för varje konto.

ansible-playbook -i hosts site.yml