Golden Book is a website designed with the purpose of allowing authors to create and share their works, while also enabling readers to read, save, and share their favorite stories.
On a personal level, this project was created with the intention of working with Typescript in React and improving my FrontEnd skills, with a focus on creating an attractive and pleasant design for both readers and authors alike, as well as the general public. My goal is to extend this project to the backend using NestJS.
This project was created with create-next-app.
The following were used:
- A homepage that displays important notices, daily recommendations, and editor's picks. It also provides access to the "Latest updates" and "Top Ranking". To give readers more freedom, we have added "Best of the Week", "Latest Releases", "Must-Reads", and "Popular Genres" sections.
- The login, register, and forgot password sections have been designed with the aim of making it easy for authors or readers to access their accounts or register.
- Responsive design: The website is fully responsive thanks to the use of the Tailwind styling library. This allows the page to adapt to different screen sizes, ensuring that users have an optimal viewing experience regardless of the device they are using.
- The website has access to dark mode, allowing the user to manually switch to their preference and the choice is saved in local storage.
- In progress:The website has the ability to switch languages, allowing authors and readers to choose between Spanish or English. The preference is saved in local storage.
- In progress: Dynamically configuring the layout of each novel with its URL. This is where you can see details of the novel, such as genres, synopsis, number of chapters, readers, views, and author. You can also leave reviews and find all reviews in one place. (The base design has been included and is under development.)
To install and run this project locally, follow these steps:
-
You can download or clone this repository to your local machine.
-
Install the necessary dependencies by running this command in the project's root directory:
npm install -
To start the development server and view the website locally, run this command:
npm run dev
The website will be available at http://localhost:3000 in your web browser.
That's it! You should now be able to see and interact with the website on your own machine.
Dark mode:
Login, Register:
