DEV Community

Alfonso Pruneda
Alfonso Pruneda

Posted on

Creating a simple pick-your-path webpage with Authentication/Authorization

Hello and welcome to my second blog post! Today I wanted to talk about a project that I did in one week for the coding bootcamp that I am attending.
To give some background, This project was created using Ruby on Rails with sqlite3 as a database, HTML, and CSS only. The main purpose of this project was to make sure we had an understanding of the MVC structure(models,views,controllers) as well as RESTful conventions. The only thing we weren't allowed to use was javascript since later on it's something that we would be taught.
Alright, on to the fun stuff! So when first deciding what to do for my project after been given the guidelines, I was having difficulties coming up with any good ideas that I thought would work. Luckily, I had a good friend help me go through a process of choosing something that I would like. We first talked about some of the things that I really liked in general. So as an example, two things I picked out were pokemon and horror games. Then, I went into thinking of some examples based off of those topics. To not overload with details, two examples I did for horror games were slender man and resident evil. Knowing those examples, I was able to think about the theme of those games and ended up with a topic for my project. Based off the title, you already have an idea, but I ended up deciding on making a horror-themed webpage where users can go through a story and they have options based on where they are in the story.
After knowing what I wanted to do, I went through the process of creating my models and this is what I ended up with. (I did have to go back eventually and rethink my models to make things simpler and removed the monster and monster joiner models)Alt Text
Then I created the model associations as well as adding validations, and authorization/authentication using BCrypt.
Alt Text
Then I created the Controllers with authorization/authentication, and sessions as well
Alt Text
Alt Text
After all that, all that was left was to create html.erb file for the views and all the structure of the webpage which I used CSS grid and flexbox.

I will say that after trying to learn CSS, CSS grid, and flexbox for a week, I still have a lot to learn. For me personally, the CSS that I wrote seems very sloppy at best so I'll definitely make it a note to improve on that.
Also, just so I don't overload you with all the code that I wrote, I'll just go ahead and link the github repository for this project if you'd like to look at it even further. I'll also provide a link to the webpage for the project itself which was deployed using Heroku. (It was quite a learning process changing the database from sqlite3 to postgresql since I can't deploy to Heroku using sqlite3, so if you maybe want some more information about that and how I did it, let me know in the comments below!)

And that's it! Unfortunately I know I didn't really explain in detail about some of the processes that I went through, but if that's something that you would appreciate or would like to know more about, let me know and I'll do my best to implement it more, Thank you for your time.
Flatiron Horror -Webpage
Github Repository for Flatiron Horror

Top comments (0)