Skip to Content

Create a Text-Based Game From Scratch (HTML/PHP/CSS/SQL)

Text-based games are by far the easiest type of game to create.

Requiring a basic knowledge of html, php, css and SQL. As well as a keen ability to Google things. It’s also FREE!

I created Velrania from scratch. The first page of code was written without ANY previous experience. 

I’ll be helping you make your own game, providing the code for you – as well as explaining how the basics work. 

In general, Google is incredibly helpful. Searching “how to change font color in css” for example will grant you results in a few seconds.

To get started, you need…

Once you have those 2 ready, move on…

Creating the Database

The database will store all the data of your users, as well as anything you decide to add to the game (weapons, mounts etc).


1) http://localhost/ will be where you manage your server, visit it.


2) Click “phpmyadmin”, login username is “root” and password is blank.

No one can see these databases other than you, as WampServer runs locally.


3) Add a new table called “game” and make sure the language is set correctly.


4) Under “create table”, type “users” and click “Go”


5) You’ll see 4 rows. Type ID, username, password & email into the names for the 4 rows. Tick “A_I” for ID to auto increment, change the type for the other three entries to varchar & length to 250. Then save it.


6) Add another new table called “stats”. For entries, add ID, level, exp, gold, attack & defense. Make sure ID is set to auto increment again. Click save.

 

That’s the database done!

 

REGISTRATION & LOGIN

1) Access your files at: C:\wamp64\www


2) Create a new php file called “connect.php” using your coding software, this will be used to connect to the SQL database. With the following code…



3) Create a new php file called “header.php”, this will be used to call the connect.php file (as well as a lot of other things later on). With the following code…


4) Create a new php file called “home.php”, this will be used to call the header.php file. With the following code…


5) Browse to http://localhost/home.php/ and see it say hello 🙂


6) Let’s add Registration. You’ll need a basic HTML form …


 7) Once the user clicks “register”, some stuff will need to happen.

php will need to grab the inputted data using POST, then clear it of SQL injection with real_escape_string.

Code will need to check the entries aren’t blank, and the data is viable (username hasn’t been taken, email is valid etc) and provide errors if these aren’t met.

It’ll also hash the password so you can’t see it by simply looking into the database.

Next, it’ll use the grabbed data to input the details into the database. Creating the user account!

 

Here’s what the whole “home.php” should look like now…

Now try registration, type any details you want. If successful, you’ll get this message and you’ll also see the user in the users/stats table!


8) LOGGING IN – Add a simple login box using php. A bit of formatting would be nice here too, add “Login” and “Register” with heading tags before each form.


9) Previous form leads to “Login.php” which you’ll need to create as a new file. This will be able to login by email or username.

It’ll then initialise a logged in session which keeps track of the user’s ID, using it to call upon the database to display/interact with stats!

Here’s the code for login.php…


10) Remove “include(‘header.php’);” from “home.php” as you don’t need it now. Final “home.php” code…


11) Use the header to extract the user’s data upon login. EVERY page, once logged in, will use the header. So any variables will always be readily available. “header.php” code:


12) Create a “main.php” file, which will be the user’s home screen upon logging in. Add ID, username & stats on display. As well as a logout option.


13) Create a “logout.php” with the following code…


14) This is what the home page, after logging in, will look like 🙂