This is Udacity Nondegree Java Web Development Lesson1 Final Project

HackMd: https://hackmd.io/@EasyEatWeb/ByIvFCPzv

01 Project Overview

SuperDuperDrive Cloud Storage You have been hired by SuperDuperDrive, which is a brand new company aiming to make a dent in the Cloud Storage market and is already facing stiff competition from rivals like Google Drive and Dropbox. That hasn't dampened their spirits at all, however. They want to include personal information management features in their application to differentiate them from the competition, and the minimum viable product includes three user-facing features:

1. Simple File Storage: Upload/download/remove files
2. Note Management: Add/update/remove text notes
3. assword Management: Save, edit, and delete website credentials. SuperDuperDrive wants you to focus on building the web application with the skills you acquired in this course. That means you are responsible for developing the server, website, and tests, but other tasks like deployment belong to other teams at the company.

02 Project Directions

Starter Project A senior developer is assigned to be your tech lead and mentor, and they put together a starter project for you. It's a Maven project configured for all the dependencies the project requires, though you should feel free to add any additional dependencies you might require. You can download or clone the starter repository here.

Your tech lead already designed a database schema for the project and has added it to the src/main/resources directory. That means you don't have to design the database, only develop the Java code to interact with it.

Your tech lead also created some HTML templates from the design team's website mockups, and they placed them in the src/main/resources/templates folder. These are static pages right now, and you have to configure them with Thymeleaf to add functionality and real data from the server you develop. You may also have to change them to support testing the application.

You can download the starter code and open it as a Maven project in IntelliJ.

Requirements and Roadmap Your tech lead is excited to work with you and has laid out a development roadmap with requirements and milestones. They tell you that there are three layers of the application you need to implement:

1. The back-end with Spring Boot
2. The front-end with Thymeleaf
3. Application tests with Selenium

The Back-End The back-end is all about security and connecting the front-end to database data and actions.

1. Managing User Access with Spring Security

• You have to restrict unauthorized users from accessing pages other than the login and signup pages. To do this, you must create a security configuration class that extends the WebSecurityConfigurerAdapter class from Spring. Place this class in a package reserved for security and configuration. Often this package is called security or config.
• Spring Boot has built-in support for handling calls to the /login and /logout endpoints. You have to use the security configuration to override the default login page with one of your own, discussed in the front-end section.
• You also need to implement a custom AuthenticationProvider which authorizes user logins by matching their credentials against those stored in the database.

2. Handling Front-End Calls with Controllers

• You need to write controllers for the application that bind application data and functionality to the front-end. That means using Spring MVC's application model to identify the templates served for different requests and populating the view model with data needed by the template.
• The controllers you write should also be responsible for determining what, if any, error messages the application displays to the user. When a controller processes front-end requests, it should delegate the individual steps and logic of those requests to other services in the application, but it should interpret the results to ensure a smooth user experience.
• It's a good idea to keep your controllers in a single package to isolate the controller layer. Usually, we simply call this package controller!
• If you find yourself repeating tasks over and over again in controller methods, or your controller methods are getting long and complicated, consider abstracting some methods out into services! For example, consider the HashService and EncryptionService classes included in the starter code package service. These classes encapsulate simple, repetitive tasks and are available anywhere dependency injection is supported. Think about additional tasks that can be similarly abstracted and reused, and create new services to support them!

3. Making Calls to the Database with MyBatis Mappers

• Since you were provided with a database schema to work with, you can design Java classes to match the data in the database. These should be POJOs (Plain Old Java Objects) with fields that match the names and data types in the schema, and you should create one class per database table. These classes typically are placed in a model or entity package.
• To connect these model classes with database data, implement MyBatis mapper interfaces for each of the model types. These mappers should have methods that represent specific SQL queries and statements required by the functionality of the application. They should support the basic CRUD (Create, Read, Update, Delete) operations for their respective models at the very least. You can place these classes in (you guessed it!) the mapper package.

The Front-End Your tech lead has done a thorough job developing HTML templates for the required application pages. These templates are provided to you in the starter resources in the link above. They have included fields, modal forms, success and error message elements, as well as styling and functional components using Bootstrap as a framework. You must edit these templates and insert Thymeleaf attributes to supply the back-end data and functionality described by the following individual page requirements:

1. Login Page

• Everyone should be allowed access to this page, and users can use this page to login to the application.
• Show login errors, like invalid username/password, on this page.

2. Signup Page

• Everyone should be allowed access to this page, and potential users can use this page to sign up for a new account.
• Validate that the username supplied does not already exist in the application, and show such signup errors on the page when they arise.
• Remember to store the user's password securely!

3. Home Page

• The home page should have a logout button that allows the user to log out of the application and keep their data private.

• The home page is the center of the application and hosts the three required pieces of functionality. The existing template presents them as three tabs that can be clicked through by the user:

i. Files

• The user should be able to upload files and see any files they previously uploaded.

• The user should be able to view/download or delete previously-uploaded files.

• Any errors related to file actions should be displayed. For example, a user should not be able to upload two files with the same name, but they'll never know unless you tell them!

ii. Notes

• The user should be able to create notes and see a list of the notes they have previously created.

• The user should be able to edit or delete previously-created notes. iii. Credentials:

• The user should be able to store credentials for specific websites and see a list of the credentials they've previously stored. If you display passwords in this list, make sure they're encrypted!

• The user should be able to view/edit or delete individual credentials. When the user views the credential, they should be able to see the unencrypted password.

Testing Your tech lead trust