Posts tagged with

  1. Using Google Adsense with GatsbyJS

    In general there are two possibilies to use Google Adsense on your GatsbyJS website Auto Ads and custom display blocks.Depending on whether you choose to include Adsense ads on certain spots or whether you will leave this job to the Google AI, you can choose one/and or the other.

    Continue reading...

  2. Mastering React and OpenLayers Integration: A Comprehensive Guide

    Unlock the full potential of interactive maps in your React applications by delving into the seamless integration of OpenLayers.

    Continue reading...

  3. Dockerizing a Next.js Application with GitHub Actions

    In this article, we'll explore how to Dockerize a Next.js application and automate its deployment using GitHub Actions, thereby simplifying the deployment workflow and enhancing development productivity.

    Continue reading...

  4. Optimizing images for Next.js sites with imgproxy and docker

    How to transform and optimize images with imgproxy hosted with docker for your Next.js application.

    Continue reading...

  5. Building a Table of Contents (TOC) from markdown for your React blog

    How to create a Table of Contents (TOC) from markdown for your React blog with Javascript without any third party dependencies.

    Continue reading...

  6. Understanding Leaflet and React: A Guide to Web GIS Applications

    In this article I will explain how you can create a basic web map with Leaflet and React by using functional components without any third party packages. So i will strongly recommend to have a look at the Leaflet API reference.

    Continue reading...

  7. How to create a custom cookie banner for your React application

    Recently I implemented a custom cookie banner solution on my Next.js site which you probably have seen a few seconds before. There are a lot of prebuilt cookie banners you can use for React or Next js sites but i wanted to create a custom cookie banner which also has some personal touch and keeps the design with the website in line.

    Continue reading...

  8. How to build a related posts component for your React blog

    Some blogs have these related articles or posts sections where visitors can have a preview at more content after they just read a post. That's what I wanted to create for my personal website which is built with React (Nextjs) and in this article I want to show you how you also can do it for any other react application.

    Continue reading...

  9. How to add Google Adsense to Next.js applications

    In this article I am going to explain, how you can implement Google Adsense in Next.js applications (or any other react applications). There are several approaches for implementing Adsense on a react site and I want to show you how you can add Adsense with privacy in mind.

    Continue reading...

  10. How to deploy your GatsbyJS site on your own server

    With Gatsby 4 bringing in Server-Side Rendering (SSR) and Deferred Static Generation (DSG) you need an alternative methode to just hosting static files. Each page using SSR or DSG will be rendererd after a user requests it so there has be a server in the background which will handle these requests and build the pages if needed.

    Continue reading...

  11. A Guide to Location Tracking and Visualization with OwnTracks, Node.js, PostgreSQL, GeoServer, MapProxy, Nginx and OpenLayers

    Inspired by Aaron Parecki and who he has been tracking his location since 2008 with an iPhone app and a server side tracking API i decided to go for a similar approach. I wanted to track my position constantly with my Android smartphone and use the data to display a map with all locations i have ever been to.

    Continue reading...

  12. Fetching and storing activities from Garmin Connect with Strapi and visualizing them with NextJS

    Step-by-step guide explaining how to fetch data from Garmin Connect, store it in Strapi and visualize it with NextJS and React-Leaflet.

    Continue reading...

  13. Syntax Highlighting with Prism.js and Next.js

    Prism.js is a compact, expandable syntax highlighter that was developed with modern web standards in mind.

    Continue reading...

  14. Build and deploy your Gatsby site with Google Cloud Build to Firebase

    Ultimate guide to automate your Gatsby builds with Google Cloud Build, deploying to Firebase and optional Cloud Scheduler.

    Continue reading...

  15. How to create a Mailchimp newsletter sign-up-form for your Gatsby Site

    Managing your own newsletter is crucial for creating a sustainable online-business. With E-Mails you can build a relationsship with your audience and engage with them so they will drive some nice traffic to your new post or whatever you just have published and want to promote.

    Continue reading...