JavaScript capstone project - SeriesFeedback #36

PabloBona · 2023-06-30T00:44:44Z

The following requirements were fulfilled:

General requirements

Follow the Gitflow pattern.
Distribute the work based on a Kanban board.
Utilize ES6 JS features.
Meet the project requirements to the best of your ability.
Have no linter errors.
Apply unit tests with Jest.
Build the following interfaces: homepage and comments popup window.
Follow the design of the provided wireframes.

Project requirements

Homepage: upon loading the page, the web application retrieves data from the selected API and displays the list of items on the screen, as well as the user likes obtained from the Involvement API.
When the user clicks the "Like" button for an item, the interaction is recorded in the Involvement API and the screen is updated.
Clicking the "Comments" button displays the comments popup window.
Header and navigation of the homepage are similar to the provided design.
The footer of the homepage is similar to the provided design.
Comments popup window: upon loading the popup window, the web application retrieves data from the selected API and displays details about the selected item, as well as user comments obtained from the Involvement API.
Clicking the "Comment" button records the data in the Involvement API and updates the screen.
Counters: there are counters in all interfaces that display the number of items (on the homepage) and the number of comments (in the comments popup window)..
These counting functions should be covered with unit tests using Jest.
Record a video for your project. https://drive.google.com/file/d/1PyLQ5o93Hjioglf9RmWgMXKxZ03r7Mis/view?usp=sharing

…e .gitignore, and add "lint" script

-Create webpack.config.js -Install webpack, style-loader, css-loader, HtmlWebpackPlugin plugin, Webpack-dev-server, and cross-env -Update package.json scripts for testing, serving, linting, and building

Create a 'test' folder in the 'src' directory Add 'add.test.js' for testing purposes

Add MIT Add modules & img folder

Add header section

…Live Demo Add footer to index.html with author names

Create footer section

Add <div> for error handling Implement load event to display cards on page load Introduce api.js, getSeries.js, and renderShows.js

…2 and remove fixed-bottom class)

Update Dist

Display items homepage

Add involmentApi Add like Count at renderShows Merge API calls values

Display number of likes for each item

…r of comments

Create feature: add new comment

Add comments counter

Add tests for comments counter

UX improvements: include transitions and/or animations

Olamarx

Hi @PabloBona,

Your project is complete! There is nothing else to say other than... it's time to merge it
Congratulations! 🎉

Highlights

ES6 usage ✔️
All tests passed ✔️
Readme file professional ✔️

Good job passing at the first trial.

Optional suggestions

Every comment with the [OPTIONAL] prefix won't stop the approval of this PR. However, I strongly recommend you to take them into account as they can make your code better. Some of them were simply missed by the previous reviewer and addressing them will really improve your application.

Cheers and Happy coding!👏👏👏

Feel free to leave any questions or comments in the PR thread if something is not 100% clear.
Please, remember to tag me in your question so I can receive the notification.

As described in the Code reviews limits policy you have a limited number of reviews per project (check the exact number in your Dashboard). If you think that the code review was not fair, you can request a second opinion using this form.

PabloBona and others added 30 commits June 25, 2023 18:54

Install linters (ESLint, Stylelint, Webhint), add package.json, creat…

7d7da69

…e .gitignore, and add "lint" script

-Add index.html, styles.css, and main.js

7aef844

-Create webpack.config.js -Install webpack, style-loader, css-loader, HtmlWebpackPlugin plugin, Webpack-dev-server, and cross-env -Update package.json scripts for testing, serving, linting, and building

Add Jest as a development dependency

8b8c018

Create a 'test' folder in the 'src' directory Add 'add.test.js' for testing purposes

Add Readme

cc9d2ce

Add MIT Add modules & img folder

Fix MIT link

272d79d

Add .gitkeep to empty folder

98e4c37

Add rules for load images

a6df592

Add custom css styles for the body

0a1fc1c

Add a logo image in img folder

bfb46ef

Create the header section of the webpage

432b153

Load the css code and the logo image in index.js

a4b8585

Update bundles files in dist folder

9ec152e

Rename the css linter file

2d5e009

Fix some indentation and spacing issues

9bdfa86

Update the bundles file index.bundle.js

f23cc5c

Merge pull request #22 from PabloBona/create-header-section

1ef086a

Add header section

Improve UX/UI with updated dist files for a soon deploy in Readme.md …

a68c41c

…Live Demo Add footer to index.html with author names

Add working Live Demo to Readme.md

236542f

Merge pull request #23 from PabloBona/create-footer-section

9192875

Create footer section

Update Dist with dynamic display of shows in <section class='shows'>

702ccd3

Add <div> for error handling Implement load event to display cards on page load Introduce api.js, getSeries.js, and renderShows.js

Updating styles in footer section to improve user experience (add mt-…

9ebac9b

…2 and remove fixed-bottom class)

Updating Dist

7a8e284

Add btn-liked

8e24e1a

Update Dist

Update file

4253b75

Fix main Ele position

4ecef90

Merge pull request #24 from PabloBona/display-items-homepage

03d3125

Display items homepage

Improve API call

fb9e7b3

Add involmentApi Add like Count at renderShows Merge API calls values

Update Dist

32da25f

Merge pull request #25 from PabloBona/add-new-likes

390dce9

Display number of likes for each item

Delete comments

41cf32d

NitBravoA92 and others added 28 commits June 29, 2023 00:37

Update the HTML code of the comments counter container

a351ea2

Create the commentsCounter function in a new module to show the numbe…

113f574

…r of comments

Call the function commentsCounter to display the number of comments

05907b6

Update the menu links in the navbar

e417a79

Update the markup of the footer section

e33003e

Update the markup of the main and footer section

f5ee524

Fix some indentation and spacing errors

3df2242

Update the bundle files in the /dist folder

3ca6f63

Fix some linters issues

fcd3c37

Update bundle files in dist folder

d594b0a

Create the test cases for the function commentsCounter

39ca15c

Remove unnecessary imports

4764ae2

Merge pull request #31 from PabloBona/add-new-comment

5c33ade

Create feature: add new comment

Merge pull request #32 from PabloBona/add-comments-counter

5d51141

Add comments counter

Merge pull request #33 from PabloBona/add-tests-comments-counter

527d2e3

Add tests for comments counter

Add CSS transition to TV Show cards

69073e6

Fix a bug in the add likes functionality

0aa0333

Update menu links

9dd3ebc

Fix some spacing and indentation issues

fd66f65

Add top and bottom spacing in the main section

8a62d3e

Update the bundle files in the /dist folder

89ba76f

Improve Readme

0a93ccf

Improve Readme

ba61f32

Improve Readme

4cf6ade

Add Video

9d73385

Improve Readme

b994231

Update README.md file to fix some links issues

950732e

Merge pull request #35 from PabloBona/add-animations

dddbd1f

UX improvements: include transitions and/or animations

Olamarx approved these changes Jun 30, 2023

View reviewed changes

PabloBona merged commit bf35c45 into main Jun 30, 2023
5 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

JavaScript capstone project - SeriesFeedback #36

JavaScript capstone project - SeriesFeedback #36

PabloBona commented Jun 30, 2023

Olamarx left a comment

JavaScript capstone project - SeriesFeedback #36

JavaScript capstone project - SeriesFeedback #36

Conversation

PabloBona commented Jun 30, 2023

Olamarx left a comment

Choose a reason for hiding this comment

Highlights

Optional suggestions