Coder Social home page Coder Social logo

somat-night-club's Introduction

Somat Night Club

Somat Night Club is a REACT CRUD application that I have build with ReactJS. Somat Night Club is website that you can make your reservations for the club, to add pictures from the night, so you will never forget your expirience!

1.Technical Characteristics

To build Somat Night Club I used:

ReactJs Front-End
React Hot Toast - Notifications
FireBase - Back-End
• Pure CSS

2.Hosting

• Check my site here: SomatNightClub

3.Construction

Public Part

• Home: Welcome message that tells what the club is all about and what you can do in it!
• Contact: Contact form that the users can connect with the staff!
• Gallery: Gallery section to see everyone that have posted a photo of them in the club!
• Sign in: Sign in form to log in with your credentials!
• Sign up: Sign up form so you can register and log in of course!

Private part

• Profile: Authenticated users can access their profile and edit it by clicking the edit button!
• Picture Creation: Authenticated users can create pictures with title, date and description!
• Picture Delete: Users that are owner of the posted pictures can delete it from the Gallery, if they don't like it!
• Reservation Creation: Authenticated users can create reservation and they should write their name also for how many people is the reservation for, date of the party and details that can be used to tell if they want a table, booth(VIP also included), dry bar etc. The group can tell if it is birthday party or some occasion!
• Reservation list: Here everyone of the authenticated users can see the reservations, of course their own and see the full info by clicking the details button!
• Reservation edit: Owners of the reservation can make changes to their reservation if it is necessary!
• Impression edit: Owners of the opinions can make changes to their opinions if they want!
• Impression delete: Owners can delete the posted imppression if they thought that They don't like it anymore!
• Profile picture: Authenticated users can change their profile picture by choosing any photo from their computer!

4.Usage

Open the integrated terminal and paste these commands!
• npm install
• npm run dev

Demo User

Email: [email protected]
Password: 123456

5.Screenshots

Home Page

Image from Gyazo

Impressions page

image

Contact Page

Image from Gyazo

Gallery Page

Image from Gyazo

Picture Creation

Image from Gyazo

Reservation Creation

Image from Gyazo

Reservation list

Image from Gyazo

Reservation details

Image from Gyazo

Profile

Image from Gyazo

somat-night-club's People

Contributors

dinkicha avatar

Stargazers

 avatar

Watchers

 avatar

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.