Coder Social home page Coder Social logo

romcom's Introduction

RomCom

RomCom is a website that generates romance novel covers. The covers can be randomly generated from a pre-determined list of cover images, titles and descriptive words, or users can make their own cover!

The project spec & rubric can be found here.

Please visit our site here!

Features

When you first visit RomCom you will be greeted with a randomly generated romance novel cover with a cover image, title, and tagline that uses two descriptive words from our arrays. Every time you refresh the page you will see a new random romance novel- you can also view a new cover by clicking the "Show New Random Cover" button. If you like one of the random covers you see, you can click "Save Cover" and the image will be added to to the "View Saved Covers" page.

Screenshot of the saved covers page

If none of the randomly generated covers strike your fancy, you can go to the "Make Your Own Cover" page where you will see a form with four fields- allowing you to customize your cover with a cover image url, a title, and two descriptors which will be added to the sentence "A tale of X and Y." You will not be able to click "Make my book" and submit the form unless you complete all the fields, but once you do, you will be re-directed to the homepage where your newest, greatest, bestselling novel will be displayed!

Screenshot of a user created cover

If you are happy with your novel, you can, as always, click "Save Cover" and add it to the array of saved covers.

Additionally, users have the ability to delete covers from the Saved Covers page by double-clicking on any cover they want to remove.

Contributors

The website was built by two Front End Engineering, Mod 1 students at the Turing School of Software and Design: Alex Kio and Claire Fields. Instructors at the Turing School built the HTML, CSS and Cover.js files and provided us with a few helpful lines of code to get started with in the Main.js file (where all of our work took place).

Technologies Used

The website uses vanilla JavaScript, HTML, and CSS.

Future Additions

We are unlikely to add any future functionality to this website, but here are some ideas for features that might improve it:

  • Changes to the HTML and CSS to really make the site pop
  • Ability to preview your custom cover before creating it
  • Local storage so that all of the beautiful user-created covers would persist on page load (this was outside the scope of the project)
  • Responsive design to adapt the website to different size browser windows

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.