Create a basic user interface mockup of your project, demonstrating the basic capabilities of a single page web (SPA) application.

Week 3 Deliverable: Create a basic user interface mockup of your project, demonstrating the basic capabilities of a single page web (SPA) application. The goal is to create a basic shell, features can be either hard coded or mocked out – e.g, a page just saying “viewing my repositories goes here”. Submit under a branch called – proj-release-1. In this branch create a file called ProjectStub.md that contains a basic architecture diagram showing the components and their relationships of a single page application (SPA). To submit, go to blackboard and submit a link to your branch. This submission should just mock out some simple navigation – for example a page saying “login goes here”, a page saying “info about me”, a page saying “list all of my repos”, and a page saying “repo details will go here”. Note the pages dont need to have any functionality beyond some placeholder text. Ideally, you would also implement the router to navigate between pages. Some helpful tips: You can close this repo as a scaffold: https://github.com/ArchitectingSoftware/se577-web-demo. Note individual pages could/should be placed in the src/pages/AppPages folder. To activate routes you can modify the src/router/routes.ts file. See how much you can get done, we will spend time discussing.Week 5 Deliverable: Take the code you created in Week 3 and create a simple microservice to simulate listing repositories in git. Pull the code from the proj-Release-1 branch and create a new branch called proj-Release-2. Your interface will now call this service and render the results in the web interface. Think about the data structure that you would use, and the microservice interface (e.g., attributes that would be returned for a collection of repositories). To keep things easy, instead of using a database (which you could add as a stretch objective), think about how you can express this in an external config file in YAML format, and then parse this file into an in-memory data structure that your microservice can use to return data to your web application. Create a file called Release2.md and provide in Section 1 appropriate instructions to run and test your application.Week 6 Deliverable: Take the code from proj-release-2 and create a new branch proj-Release-3. There will be few simple updates to this releaseTake the microservice that you built in the previous release and package and host it in a docker container. Make sure you provide your Dockerfile in the repo, and either a script or a makefile to create the Dockerfile. Update the user interface to work with the service running under docker.Create an architectural model of the current state of your system – UML or C4 is fineCreate a file called Release3.md and provide a section on how to run your application with the docker component, a section showing the architectural model created above. Also provide a short narratives about the state of the current systems architecture.Week 8 Deliverable: Like normal, create the proj-release-4 branch for the basis of this weeks changes branch. We are going to wire up the application to github].Adjust your application to work directly with Github. Go to your github account via the user interface and create a simple gist showing a 3 line “hello world” program in your favorite programming language. If you don’t know how to do that info is here: https://docs.github.com/en/get-started/writing-on-github/editing-and-sharing-content-with-gists/creating-gistsEnsure you are familiar with the github API – top level page is here: https://docs.github.com/en/rest, Read this to ensure you understand how to authenticate with the github api: https://docs.github.com/en/rest/guides/basics-of-authentication, another good reference is here: https://docs.github.com/en/rest/guides/getting-started-with-the-rest-apiWithin your app render the gist from part a using the github API. Documentation is here: https://docs.github.com/en/rest/reference/gistsWithin your app also ensure you have authentication working with github. Create a page with 2 simple buttons, one for “unauthenticated”, one for “authenticated”. Each one will make the same call to the github users API. Look for the plan object in the result. The unathenticated call should not include it; the authenticated call should include it.Create a Release4.md file and briefly describe your thoughts and experiences with using oAuth and tokens to integrate with github.Submit on blackboard a link to the proj-release-4 branch.Final Project Deliverable: Weeks 9 and 10 will be focused on finishing your project. Think about a few features that you want to play with in your application via the github API. It can be exploring repos, or commits within a repo, user information, etc. Create the proj-final branch. Write some code to clean up your application and to implement the features that you thought about.Add a FinalRelease.md file. This file should have everything described that is required to build and run your final project, including scripts if necessary. The file should also contain an architecture description of your project – this includes models, architecture decisions, description of quality attributes, etcexample has been attached. please make each week deliverable a seperate set of files to show progression .Comments from Customerplease reference demo to understand requirements