๐ŸŒŒ
Privacy Village Academy
Join The Community!AcademyAbout HGPE
  • Hitchhiker's Guide to Privacy Engineering
    • โ“What is HGPE?
      • โš–๏ธWho is this for?
      • ๐Ÿง™โ€โ™‚๏ธPrivacy Engineering
      • ๐ŸŽจCreative Privacy
      • ๐Ÿ”ฎGenerative AI
      • ๐Ÿง‘โ€๐Ÿ’ปAbout the Author
  • ๐Ÿง™โ€โ™‚๏ธThe Ethical AI Governance Playbook 2025 Edition
    • ๐Ÿค–Chapter 1 : AI Literacy
    • ๐ŸŒChapter 2 : AI Governance in the 21st Century
    • โŒ›Chapter 3 - Getting Started with AI Act Compliance
    • ๐Ÿš€Chapter 4 : Rise of AI Governance: Building Ethical & Compliant AI
    • Chapter 5 : Introduction to the Lifecycle of AI
  • ๐ŸŽ“Privacy Engineering Field Guide Season 1
    • โ“Decoding the Digital World: Exploring Everyday Technology
    • ๐Ÿ‘๏ธIntroduction: Why Privacy Matters?
      • Age of Mass Surveillance
      • Privacy & Democracy
      • Privacy & Government Surveillance
    • โšกChapter 1 : How Computers Work?
      • Electricity
      • Bits
      • Logic Gates
      • Central Processing Unit (CPU)
      • Graphic Processing Unit (GPU)
      • Motherboard
      • Data Storage
      • Databases
      • Operating System (OS)
      • Computer Code
      • Programming Languages
      • The File System
      • Bugs and Errors
      • Computer Virus
      • Internet of Things (IoT)
      • Cloud Computing
    • ๐Ÿ›ฐ๏ธChapter 2 : How the internet works?
      • Physical Infrastructure
      • Network and Protocols
      • Switch
      • Routers
      • IP Address
      • Domain Name System (DNS)
      • Mac Address
      • TCP / IP
      • OSI Model
      • Packets
      • The Client - Server Architecture
      • Secure Socket Shell (SSH)
      • Transport Layer Security (TLS)
      • Firewall
      • Tunnels and VPNs
      • Proxy Server
    • ๐Ÿ–ฅ๏ธChapter 3 : How Websites Work?
      • HTML
      • CSS
      • Javascript
      • Web Server
      • Browser
      • HTTP
      • Databases
      • Front End (Client Side)
      • Back End (Server Side)
      • Cookies
      • Local Storage
      • Session Storage
      • IndexedDB
      • XHR Requests
      • Web APIs
      • Webhooks
      • Email Server
      • HTTPS
      • Web Application Firewall
      • Single Sign-on (SS0)
      • OAuth 2.0
      • Pixels
      • Canvas Fingerprinting
      • Email Tracking
      • Containers
      • CI/CD
      • Kubernetes
      • Serverless Architecture
    • โš›๏ธChapter 4 : How Quantum Computers Work?
      • Quantum Properties
      • Quantum Bits (Qubits)
      • Decoherence
      • Quantum Circuits
      • Quantum Algorithms
      • Quantum Sensing
      • Post-Quantum Cryptography
    • ๐Ÿ“ณChapter 5 : Mobile Apps and Privacy
      • Battery
      • Processor
      • Mobile Operating Systems
      • Mobile Data Storage
      • Cellular Data
      • Mobile Device Sensors
      • Wireless Connectivity
      • Camera & Microphone
      • Mobile Apps
      • Software Development Kits (SDKs)
      • Mobile Device Identifiers
      • Bring Your Own Device (BYOD)
  • ๐Ÿ•ต๏ธโ€โ™‚๏ธPrivacy Engineering Field Guide Season 2
    • โ“Introduction to Privacy Engineering for Non-Techs
      • ๐ŸŽญChapter 1 : Digital Identities
        • What is identity?
        • Authentication Flows
        • Authentication vs. Authorization
        • OAuth 2.0
        • OpenID Connect (OIDC)
        • Self Sovereign Identities
        • Decentralized Identifiers
        • eIDAS
      • ๐Ÿ‘๏ธโ€๐Ÿ—จ๏ธChapter 2 : De-Identification
        • Introduction to De-Identification?
        • Input / Output Privacy
        • De-identification Strategies
        • K-Anonymity
        • Differential Privacy
        • Privacy Threat Modeling
  • ๐Ÿ“–HGPE Story and Lore
    • ๐ŸชฆChapter 1 : The Prologue
    • โ˜„๏ธChapter 2 : Battle for Earth
    • ๐Ÿฆ Chapter 3 : A Nightmare To Remember
    • ๐Ÿง™โ€โ™‚๏ธChapter 4 : The Academy
    • ๐ŸŒƒChapter 5: The Approaching Darkness
    • โš”๏ธChapter 6 : The Invasion
    • ๐ŸฐChapter 7 : The Fall of the Academy
    • ๐Ÿ›ฉ๏ธChapter 8 : The Escape
    • ๐ŸชChapter 9 : The Moon Cave
    • ๐Ÿฆ‡Chapter 10: Queen of Darkness
  • ๐Ÿ“บVideos, Audio Book and Soundtracks
    • ๐ŸŽงReading Episodes
    • ๐ŸŽนSoundtracks
  • ๐Ÿ‘พHGPE Privacy Games and Challenges
    • ๐ŸŽฎData Privacy Day'23 / Privacy Treasure Hunt Game
    • ๐ŸงฉPrivacy Quest
  • ๐Ÿ“ฌSubscribe Now!
Powered by GitBook
On this page

Was this helpful?

  1. Privacy Engineering Field Guide Season 1
  2. Chapter 3 : How Websites Work?

Javascript

Javascript is the third layer of the standard web technologies that lives on top of HTML and CSS.

PreviousCSSNextWeb Server

Last updated 2 years ago

Was this helpful?

JavaScript can manipulate the HTML elements and add interactivity.

For instance, you can use JavaScript to add interactivity to websites, validate forms or track users' actions on a website. So yeah, big part of web tracking is powered by javascript.

Some privacy zealots even block all javascript just as an adblocker to minimize their digital footprints.

If you want your web page to do more than just sit there and display static information, you need to implement JavaScript to make it more interactive.

So think of javascript as the third layer of the standard web technologies that lives on top of HTML and CSS.

So let's put Javascript in action, shall we?

We have already created a beautiful login page using HTML and CSS. Now we would like to verify whether the inputs we collect are indeed in the format we requested. We can set up a validation mechanism through Javascript. Thus, we can take a measure to ensure the accuracy and correctness of the data collected from the data subjects.

function ValidateEmail(inputText)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(inputText.value.match(mailformat))
{
alert("Valid email address!");
document.form1.text1.focus();
return true;
}
else
{
alert("You have entered an invalid email address!");
document.form1.text1.focus();
return false;
}
}

We can go even further and use more complex snippets of Javascript to measure the people who come to the page where the login form is located but did not provide any inputs.

So we might want to get some metrics and measure how well our registration form tunnel is working. By adding a tracking code, we can start measuring incoming visitors. We will need to obtain the explicit consent of the users in order to make the follow-up we want to carry out here in compliance with the law. We can start the user tracking we want to perform by adding the following piece of code to our registration form page.

<script type="text/javascript"

  var _paq = window._paq = window._paq || [];

  _paq.push(['trackPageView']);

  _paq.push(['enableLinkTracking']);

  (function() {

    var u="//{$VERILOGY_URL}/";

    _paq.push(['setTrackerUrl', u+'matomo.php']);

    _paq.push(['setSiteId', {$IDSITE}]);

    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];

    g.type='text/javascript'; g.async=true; g.src=u+'verilogy.js'; s.parentNode.insertBefore(g,s);

  })();

</script>>

So there you go, your first step into to start getting used to why you'd use JavaScript and what kind of things you can do with it.

๐ŸŽ“
๐Ÿ–ฅ๏ธ
โ€œAlright, I know you more than anyone in the Academy. So you sneaking out in the middle of the night to go after the signals is a very high probability. I believe I just wanted to protect you, you know.โ€ said Kyle. The anger on Redโ€™s anger seemed to dissolve into a more innocent and caring expression. โ€œI hate it when I feel like you can read my mind. This was the first idea that occurred to me the second you told me that the signal was lost.โ€ - Journals of Order of Epoch, 2341 Anno Domini
Page cover image