Live Demo

Live Demo

Description

In this project, we build a basic website that receives dog show image with all data about that dog. The Webapp has two interfaces: A home page, showing a list of dog , icon to like the dog and the comment button . the second interface is a popup window with more data about the dog that you can comment on.

Demo 📝

Interface 1

Interface 2

Learning objectives:

• Use JavaScript to make websites dynamic and build basic single page apps.

• Use ES6 syntax.

• Use ES6 modules.

• Use callbacks and promises.

• Use webpack.

• Apply JavaScript best practices and language style guides in code.

• Use AAA pattern for unit tests.

• Write units tests for a JavaScript app.

• Follow Gitflow.

• Solve simple git conflicts.

• Send and receive data from an API.

• Use API documentation.

• Understand and use JSON.

• Make JavaScript code synchronous.

• Perform a code review for a team member.

• Built With

• HTML

• CSS

• JavaScript

• webpack

• jest

• ES6

Getting Started

To get a local copy up and running follow these simple example steps.

1. Download the Zip or (git clone)[https://github.com/ericmahare/javascript-capstone.git]
2. cd books-app
3. Then open in your browser by using live server\

Install

• On your terminal run : npm i
• For Webpack to build and bundle the app files : npm run build
• For Webpack to start the development server : npm run start
• In case you run into any errors please raise an issue.

Test

For tracking linter errors locally you need to follow these steps:

• After cloning the project you need to run this command

  npm install This command will download all the dependencies of the project

• For tracking the linter errors in HTML file run:

  npx hint .

• For tracking the linter errors in CSS file run:

  npx stylelint "**/*.{css,scss}"

  • And For tracking the linter errors in JavaScript file run:

  npx eslint .

Authors

👤 Magana Assia

• GitHub: @MaganaAsiati
• Twitter: @asia_magana
• LinkedIn: Asia Magana

👤 ** Eric Mahare**

• GitHub: @erikmahare
• Twitter: @erikmahare
• LinkedIn: Eric Mahare

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

• dog API - for displaying the dog image
• Involvement API. - for displaying the likes and comments
• Hat tip to Microvers and all the staff
• Thanks to My coding Partners
• Thanks to My Morning-session-group and Standup-team Partners and
• Thanks to Code Reviewers

📝 License

This project is MIT licensed.