# Foundry VTT Module Making for Beginners - Introduction
###### tags: `module-tutorial` `foundry-vtt`

So you want to make a Foundry VTT Module but you're not sure where to start?

This tutorial will start at the very beginning and end with a working module, explaining as much as is feasible to explain along the way.

## How to read this tutorial

This tutorial works best as a start-to-finish step-by-step journey into module making. It will walk you through each part of the process, **including some purposefully wrong steps** to demonstrate how to debug things when they do not work. As a result, if you copy and paste directly from some examples without the context, things might not work.

## What we'll be building

Here's the elevator pitch:

> A module which allows each individual user in a Foundry VTT world to have a to-do list that they can add entries to, mark entries complete, and delete entries from.

## What we'll learn about

By the end of this tutorial, you'll have at least touched each of the following core Foundry VTT API concepts:
- Hooks
- Flags
- FormApplication
- Dialog
- Settings
- Handlebars
- CSS
- Localization

From my experience, having a working understanding of these Foundry-specific things in addition to a working knowledge of Javascript, HTML, and CSS is a rock solid baseline for starting to create Foundry VTT Modules.

## Prerequisites
### An activated local FoundryVTT installation on version 0.8.8+ or version 9

All of the pieces this tutorial interacts with are in the Public API for Foundry VTT and thus it is expected to be relevant for a long time, but it is confirmed to be working on Core version 0.8.8 and version 9 stable.

### Some working knowledge of HTML, CSS, and JavaScript (ES2020)

If you're completely new to these technologies, this tutorial can still be helpful to you, but you may find yourself overwhelmed.

## Style & Organization Notes

### Code Samples

Code Samples will be styled like so:

// This is some Code

Ocassionaly there will not be line numbers or syntax highlights.

// This is also a code sample

### Errors

Sometimes we'll be debugging errors that our code has, they'll be styled like so:

:::danger
Error: This is an error.
:::

### Programming Concepts

Where relevant, we'll be learning some concepts tangential to Foundry VTT specific work. These will be styled like so:

:::info
**Programming Concept: Foo**

"Foo" is a common placeholder when creating examples.
:::

{%hackmd io_aG7zdTKyRe3cpLcsxzw %}