In this tutorial we will go through the steps of reviving an archived (student) portfolio website from the old portfolio server. Focus is on a site that was made using WordPress. We will install a local webserver using XAMPP, a bundle that contains Apache (the webserver), PHP and a MySQL database. So the webserver can … Continue reading How to restore an archived (student) portfolio website
Latest update: 19-09-2024 The portfolio website service has been terminated per July 1 2024. This impacts these sites: Student sites which were hosted there are associated with the study programmes Industrial Design Engineering, Creative Technology and ATLAS. If you had a website on the portfolio sites, you might want to take steps to transfer it … Continue reading Termination of portfolio website service
This tutorial will explain how to deploy a basic, html-based site (consisting of static pages) to Github pages. This tutorial assumes you already have some basic knowledge of how to create webpages and coding in HTML, CSS. If not, do this tutorial first. For this tutorial this template based on the W3.CSS framework from w3schools … Continue reading Deploying a website to Github pages
This tutorial will learn you how to create your first webpage using a basic text editor by writing/editing code. Learn HTML We will not learn you how to code HTML or CSS. Use a tutorial like W3Schools for that: start with the “HTML introduction” and follow the pages until “HTML CSS”. Basic steps These are the basic … Continue reading Getting started with your first website
Tips and information on using the chat service Tawk.to.
Codesandbox.io is and online coding environment (IDE) which can also be used as a basic HTML/CSS editor. This article briefly introduces the first steps to get started using it for basic web development. Using Codesandbox for web development has some advantages: No software needs to be installed on your computer Works in a browser If … Continue reading Using Codesandbox as a basic HTML/CSS editor
A new tutorial is available which introduces steps to create an App mockup using Figma. Figma is an online prototyping tool which can be used to design Apps and websites. This tutorial introduces the basics of prototyping an app with Figma. It quickly ‘touches’ all necessary steps without going into too much detail. You can … Continue reading How to create an App mockup with Figma – a tutorial
Since the addition of the blocks editor in WordPress, you can add a Lightbox to a gallery. However, the information in this article is still relevant if you would like to add you own Lightbox. Learn to create a gallery with a lightbox which allows you to click the image and view it in an … Continue reading Create a gallery with a custom lightbox
Update: there is an easier solution: use a browser extension. Twitter recently changed the interface of its website completely. I did not like it really and decided to do something about it. I installed the Chrome extension “User-CSS” which can ‘inject’ any CSS code for a site. I changed the columns widths to make more … Continue reading Restyle any website – the Twitter case
Today I created a coding example which demonstrates how to read Exif data from an uploaded photo and extract the GPS location from that and show the location of where the photo was taken using Google Maps. To accomplish this, I combined two pens from CodePen into this example: “Google Maps Latitude & Longitude by … Continue reading Show location of photo in Google maps