Hey there ^^! I'm also an aspiring fellow virtual pet site developer (also a hobby, they're very fascinating to make!).
So I haven't released anything yet, however I'm going to approach this from a regular web dev standpoint, as the process should be similar :). Hope that's ok!
So first off, this site/forum has been a huge help in just seeing all aspects of pet site development: coding, planning for a userbase, game balancing, etc.
It's called
https://thegaminglist.com/.
They have a couple of really good tutorials to get started seeing what's involved. Here's a good little overview on the coding aspect, namely just things to take into consideration:
link here.
Something that's helped with planning is looking at how some closed species run their groups! A lot of them have their own websites (like Bagbeans, Strudels, etc) that act similar to virtual pet sites. One common framework for adoptable/closed species sites I've seen is called
Lorekeeper (link to the github repo). It's made using Laravel I think, so that might be a good place to dive into, and just view how they've laid out the coding.
For everything else, I'll break stuff down into the sections I think would be the most logical, but feel free to explore :D!
(if some of this covers stuff you already know, I do apologize ^^; !)
Setting Up Your Code Repository
Before jumping into anything else, you're going to want a
code repository. This is a place that holds your code that's on a different server/not on your machine, and gives you more control to undo/roll back code changes if something breaks, or you don't like where something is going. The most popular/well-known code repository is called
GitHub (link to site).
Once you make an account there, you can create your first repository! They actually have a good tutorial for github basics
here.
You'll also want to learn Git, which are sets of commands to help you manage your codebase (and more commonly: add code to it!).
Prototyping
Before looking into hosting, honestly I'd suggest getting your own personal development environment going! That way you don't have to worry about paying for hosting just yet as you'll be prototyping. This stage is important, as it'll allow you to make a very rough and easily editable version of your game that you can test out frameworks and technologies with, learn about databases and hooking up various parts together in a smaller environment (like connecting your database to your backend, your backend/API to your frontend, etc).
I personally use a virtual machine (VirtualBox) for my development environment with a Linux/Ubuntu OS on it. Linux is much easier to develop in than Windows for me personally lol. It also makes it easier to edit stuff with less fear of messing up your everyday OS. But you can also start on your personal OS!
Prototyping - Choosing Your Tech Stack
After signing up for GitHub, the next step is figuring out what languages/technologies you'd like to use. This...is definitely its own tutorial, choosing technology stacks XD. However, to easily get started, you'll probably want to look into:
- Javascript (Front-End)
- ExpressJs/NodeJs (Back-End)
- Postgres or MySql (Database)
Regardless of which you end up choosing, you'll always need one of each of these types of components:
- A Front-End Technology - shows the actual visual part of the website! Buttons, the actual virtual pets you see, user profiles, etc. The "pretty" side, so to speak :)
- A Back-End Technology - this relays information from the Front-End side to the database! For instance, if a user click a button to feed their dragon, the back-end relays that "feed" click to the database to say "hey, this user wants to feed this dragon. Increase their stamina by 5 and save it please, thanks :)."
- A database - This stores all of your information! Like, everything lol. All the users you have, all the items they have in their inventories, all the pets they have, all the forum posts they posted, all of that information is stored here.
This is probably the least intensive technology "stack"/list to learn, and to just understand the basics to how the entire site will work. Note that this may not end up being the "final" set of technologies you end up using! But that's the importance of prototyping: you get a chance to play around with various tech and get a feel for how they work, and whether you like it or not.
This is where you'll be doing the most learning and looking up tutorials, as you want to be very familiar with your tech stack! Once you learn the basics, you can start branching out in your prototype and creating your more unique features to your site.
For reference, if you would like to go the Java route, there's a popular backend framework called Spring! So if you decide to do Java, I'd look into that. It's...a lot, but it's very robust.
Prototyping - Fun Extras (like PNG layering)
If you want some fun extra things, like clothing layering, now's also the perfect time to look into technologies that support that!
For your question about clothing layering on adopts, there's a tool called
Imagemagik
(<-link) that I've heard of. You might be able to connect it to your code and do the layering!
If you go the php route, here's a StackOverflow question asking about image layering, I think you can do it programmatically!
Link here.
Art, Items, and Site Identity
Next up is the colorful part: Art! Yay :D! By now you should have your prototype up and running fairly well with placeholders (or boxes!), and are ready to add the art side. I'd suggest slowly adding art for the larger things first (such as the pets an clothing) as that's the main focus, and then move to the items. That's because items can quickly span out of control (recolors, you want to add a new item type that requires more coding AND art!) and isn't quite as much of the focus as your pets are!
This is also where you might want to start sprucing up the site layout (as it's probably been a test layout for a while, can totally relate XD) and figuring out what colors you want, etc. You might want to make some mockups in an image editor of your choice so you can figure out the look without committing to the potential hours of coding...just to figure out you don't like it XD.
Cleaning up!
At this point, you should have a fully functioning site on your local machine! Since this is a hobby project, cleaning up can be done now. In a more traditional business web app, you'd want to plan for things like security, site layout, scale of the project
before coding as the more code and finalized assets you have, the more difficult and time consuming it becomes to change anything. However, since this is for practice, now is fine!
Refactoring - Cleaning Old, Buggy Code
First off, if there's some code in an area that runs mega slow or is very error prone, you might want to clean it up and have it run a little faster. This can become a rabbit hole of constant fixing, so perhaps list out a few things you noticed you'd like to improve on, and stick to that list.
Security!
Next up, before diving into hosting, if you plan on this being open to
anyone, you need to secure your application! There are unfortunately evil people out there that want to hack even hobby sites, anything that's on the web is fair game. So if you even get one user on your site, you're required to protect their information!
This is a huge topic, but for the basics, you'll want to look into:
- User login/logout session security - you more than likely have a simple login/logout system, so now's the time to secure it and lock it down a bit.
- Input Sanitation (making sure someone can't use a simple form/text input to upload malicious code to the server!)
- Password Protection - you'll need to look into ways to protect passwords on all layers, but especially the database layer. Normally this will involve things such as password salts, etc.
- User Data Wiping - if a user wants to delete their account, make sure everything is properly wiped!
Domain Name
After your prototype, you're ready to start getting your application on a host and shown to people. First off, you need to secure a
domain name. These cost money normally, so be aware! I personally haven't registered a domain before, so it's a bit of the wild west for me, sorry ^^;. But usually you'll buy/register a domain, and then link that domain name to your hosting provider so they know that when someone hits "myawesomepetsite .com", it directs them to your application!
Hosting
Once you've gotten your prototype to a good stage and secured, the next part is hosting! For hosting, honestly, if it's a hobby, you might be able to get something small to just start out with, like GoDaddy, HostGator, etc. However, if you have even an inkling that it might be a little bigger (like 15+ players at the same time), you probably will want to look into
cloud hosting. Cloud hosting is much more expensive, but it allows you more dynamically scale the amount of servers, etc you have if you happen to get a peak in traffic. You'll be able to allocate more resources much easier, and a lot of times you can just pay what you actually use.
Cloud computing is its whole own topic, but
here is a good overview of the benefits of it.
Some of the more well known cloud hosting providers are:
- Microsoft Azure
- Amazon AWS
- Google Cloud Platform
- Digital Ocean
Most of them have pricing calculators that you can mess around with to get a feel for what a month of expenses will look like.
At this point, depending on how hardcore you'd like to dive into this, you can also start looking up technologies like Docker and Kubernetes to provide multiple instances of your app. That way it's easier to spin your app up and down, vs doing it all on just one instance! Note that these technologies start going into deeper things you may not be interested in hobby-wise, but just throwing it out there in case traffic/interest in your site picks up and you'd like to know the possible next steps to scale for the increased traffic ^^.
After you acquire your hosting, you'll need to look up guides on how to
deploy your application to them. This will normally be called a "production build" for the technology stacks that you're using. This will take some time to figure out, so be sure to set aside some time to look up tutorials and practice! And don't get discouraged, getting your application to a running production build is a pain usually, but keep at it and soon, you'll see your application smiling at you from the servers!
Conclusion
Whew! That was a lot! Sorry for the word dump, but this is the general process I think you'll have to go through to work on your project. There is a lot more I can go into, but this is the 10,000 foot view of the bare bones you'll need.
Feel free to ask me any questions! I'm a web dev by trade, so I'm totally down for answering them ^^! Hope this helped a bit!
! And yes, most definitely will PM you, nerding out about this stuff is so much fun 
!
