Search for question
Question

11/06/2023, 13:30

WebStack 2023

1. Set up the project:

Assignment 1: Favorite Movie App

Objective: Create a Favorite Movie List app using React for the front-end and Express for the

back-end. Implement CRUD functionalities to allow users to add movies, display the movie list,

update movie information, and remove movies from the list(it is similar to ToDo list app). I

encourage you to be creativity in designing and styling the app.

Requirements:

Assignment 1: Favorite Movie App - WebStack 2023

• Create a new directory for your project.

• Initialize a new React app using Create React App.

• Create a new directory for the Express server.

• Initialize a new Node.js project in the server directory.

• Install necessary dependencies (e.g., Express, body-parser, cors).

2. Front-end (React):

• Create a main component, such as App, to serve as the root component.

Implement a form to allow users to add new movies to the list.

• Fetch and display the list of movies from the server.

Display each movie with its title, description, and any other relevant information.

• Add a remove button next to each movie to delete it from the list.

• Add an update button next to each movie to modify its information.

Implement update functionality to allow users to edit movie details.

Style the app creatively using CSS or CSS frameworks.

3. Back-end (Express):

• Set up a server using Express to handle API requests.

• Create necessary routes to handle CRUD operations.

• Implement a GET route to fetch the list of movies from the server.

Implement a POST route to add new movies to the server.

• Implement a PUT route to update movie information.

• Implement a DELETE route to remove movies from the server.

Ơ

https://omandakh.gitbook.io/webstack-2023/model-5/assignment-1-favorite-movie-app

:

1/2 11/06/2023, 13:30

• Store the movie data in memory (no database required).

Please complete the app as close as possible with this design.

Movie List

Movie Name

The Shawshank Redemption

The Godfather

The Dark Knight

Schindler's List

Pulp Fiction

Fight Club

Terminator 2: Judgment Day

Modern Times

Genre

Drama

Drama

Action

Drama

One Flew Over the Cuckoo's Nest Drama

Action

Drama

Action

Assignment 1: Favorite Movie App - WebStack 2023

Comedy

Next - Model 6

Students DB in MongoDB

Release Date

1/1/1994

3/14/1972

7/14/2008

11/30/1993

5/21/1994

9/10/1999

11/19/1975

7/1/1991

2/5/1936

Studio

Columbia Pictures

Paramount Pictures

Warner Bros. Pictures

Universal Pictures

Miramax Films

20th Century Fox

United Artists

Tri-Star Pictures

United Artists

Last modified 12d ago

Score

93

92

90

89

88

87

86

85

84

https://omandakh.gitbook.io/webstack-2023/model-5/assignment-1-favorite-movie-app

ZEDIT

ZEDIT

ZEDIT

ZEDIT

ZEDIT

ZEDIT

ZEDIT

ZEDIT

ZZEDIT

ADD NEW MOVIE

DELETE

DELETE

DELETE

DELETE

DELETE

DELETE

DELETE

DELETE

DELETE

Model 5 - Previous

CRUD methods

2/2