Static Sites

Development

Developed using React Router v7 in framework mode. Not too much magic as in Next.JS Remark can help for rendering markdown.

Technical Decisions

  • Root relative vs relative paths
  • Href / Src / fetch with constants or variables
  • Static external resources or API calls
  • Path ending with / or index.html or client side JS or web server attachinh .html
  • React 19 based hydration or not
  • Client JS heavy or light

Hosting

For static hosting, Cloudflare free plan looks very nice. Following actions are required:

  • Buy domain, preferably from Cloudflare itself
  • Create a Cloudflare Pages project
  • Upload site as zip
  • Add DNS entry for "www" subdomain
  • Add rule to forward "www" to root domain
  • Add email forwarding to gmail

Custom Domain Email

For custom domain email sending with Gmail:

  • Enable two factor authentication
  • Create an app password
  • Enable DMARC
  • Add a custom address in Accounts -> Send mail as
  • Not as an email alias, with smtp.gmail.com & gmail username & generated app password

For transactional email, when used with a backend part, Brevo looks reasonable.

Web Traffic Analytics

For analytics:

  • Google Analytics script tags to be added. In React, useEffect is employed.
  • Consent is not configured in GUI. In script, this can be disabled, but then no data is visible.
  • May not be GDPR compliant if cookiees are added by Google Analytics

Tag manager is required for adding/modifying tags (Ads, Analytics etc.) without modifying code. But small sites does not require this.

GDPR Compliance

For GDPR compliance, (1) disable ad personalization, (2) data retention limit, (3) anonymize IP, (4) Display data privacy policy, (5) do not share data with other google products (like Ads) etc.

For consent, preferably disable in EU & similar regions. Enable all third party cookie tracking for other regions. But don't yet know how to do this. So the consent options are not configured.

gtag script reference can be checked for some details. Google Analytic Developer site specifies their configuration.

uBlock Origin will block analytics code, even during development/setup.

Google Search Console

  • Submit sitemap
  • Check indexing issues reported by Google
made with ♥️