这是一篇美国的管理应用程序代写
Task
- Update the NgRx Store structure to include a property that will keep track of whether someone has searched for books.
- Create and dispatch an NgRx Action to the NgRx Store to save whether someone has searched for books using the Assignment 1 component.
- Remember to only dispatch this action at the appropriate time. (Consider:which component should dispatch the Action?)
- In the Assignment 2 component, use a selector to get the value of the property you created in step 1 and display it in the Assignment 2 HTML template.
You are allowed to refer to any code from our course repository to help you. You will not need to use the Angular CLI to generate any new components or services.
I recommend installing the Redux DevTools browser extension to test whether your changes work. You can find it here:
https://chrome.google.com/webstore/detail/reduxdevtools/lmhkpmbekcpmknklioeibfkpmmfibljd .
Grading
You will be marked on the following criteria:
- Is the application functional?
- Make sure to test it in your browser by running npm start and then going to your browser to make sure it works.
- Make sure to check the Redux Dev Tools extension to make sure your Action was dispatched and that the Store holds the data you are storing.
- Did you dispatch the action in an appropriate place?
Submission Details
Please make sure to branch off the desn3037 branch with your own branch name in the format: assignment-2/your-student-number.
After that, commit your changes and push your branch. If you need help with commands for these steps, you’ll find them in the Setup/Submission Instructions section below.
Setup/Submission Instructions
- Clone our course repo from https://github.com/danieldafoe/teaching .
- git clone https://github.com/danieldafoe/teaching2. Switch to the desn3037 branch.
- git checkout desn3037
- Branch off the desn3037 branch with:
- git checkout -b assignment-2/your-student-number
- Make sure you have the project dependencies installed. To do this, follow the
steps below while in the same directory of the repository you cloned:
- npm install
- npm install -g @angular/cli@12
- Send me your GitHub username or email so that you can be added as a collaborator to the repository.
- After I confirm you’ve been added as a collaborator, check your email and accept the invitation.
- Once you’re finished the assignment, commit your changes and push your branch to GitHub. You may use a git client or VS Code git functionality to do this. If you want to use the command line, the commands are below.
- git add .
- git commit -m ‘assignment 1’
- git push -u origin HEAD
Tips
–
– Think about the benefits of the design patterns you’ve learned about and what problems they can solve. This will help you know which patterns to use in a certain situation.
– I’ve commented the code in the store/index.ts file to make sure that it’s clear what is happening and to give you hints about various parts of how we set up NgRx.
– If you see a red, squiggly underline in the code that you write or the code you’ve edited, that’s VS Code telling you there’s something wrong with the code and your application probably won’t build properly.
o Hover over the red underline with your mouse to learn more about how to fix the error. If you get stuck on an error, feel free to reach out to me.
– To run the application, use the following command from within the cloned repository:
o npm start
▪ If you don’t see the application running when you visit localhost:4200 after running this command, the application may have failed to build. This means you’ve done something wrong in your code. Check the terminal to see what the error output says to help you solve the problem. If you get stuck on an error, feel free to reach out to me.
– If you encounter any sort of error that isn’t talked about here, please reach out to
- I can’t tell you what to do, but I can help troubleshoot issues with your code.
