DSCATALOG

Spring React Bootcamp project

UML Diagram

Back-end Skills

• Create Spring Boot project
• Create Git monorepo
• Organize the project in layers
  • REST Controller
  • Service
  • Data Access (Repository)
• Create entities
• Configure project test profile
• Database seeding
• Create REST web services
  • @PathVariable route parameters
  • Request parameters @RequestParam
  • Request body @RequestBody
  • Response to the ResponseEntity request
• DTO Standard
• full CRUD
• Exception handling
• Postman (collections, environments)
• Audit data
• Data pagination
• Associations between entities (N-N)
• Automated testing fundamentals
  • Types of tests
  • Benefits
  • TDD - Test Driven Development
  • Good practices and standards
• JUnit
  • Basic (vanilla)
  • Spring Boot
    • Repositories
    • Services
    • Resources (web)
    • Integration
• Mockito & MockBean
  • @Mock
  • @InjectMocks
  • Mockito.when / thenReturn / doNothing / doThrow
  • ArgumentMatchers
  • Mockito.verify
  • @MockBean
  • @MockMvc
• User and Profile Data Model
• Validation with Bean Validation
  • Annotations
  • Customizing the HTTP response
  • Customized validations with bank access
• Authentication and authorization
  • Spring Security
  • OAuth 2.0
  • JWT Token
  • Route authorization by profile
• Tips for Postman
• Environment variables in the project with coalescence

Frontend skills

Layout and navigation

Skills

• ReactJS
  • Project creation
  • Project structure
  • Components
  • Imports
  • Use of images
• Layout
  • HTML
  • CSS
    • Manual styling
    • Flexbox -Bootstrap
    • Responsiveness
  • Figma project execution
• Routes
  • React Router DOM
  • Routes and links

API integration

Skills

• Props
• More about layout
  • ProductDetails screen
  • Catalog screen
  • Admin Screen
• More about Routes
  • URL Parameters
  • Hierarchies (nesting)
  • Redirects
• Integration with back end
  • Axios
• React Hooks
  • useState
  • useEffect
• Effects: “loaders”
• “root” forms
  • Event handling
  • Form state manipulation
  • Form submission

Authentication and authorization

Skills

• Forms
  • React Hook Form
  • Form validation, regular expressions
  • Error messages and conditional styling
• OAuth2 Login
  • Interceptors
  • LocalStorage
    • Data access
    • JSON parse/stringify
• Global state with Context API
• Authentication and authorization flows
  • Protected routes
  • Login and authorization redirects
  • Special redirects for user experience (UX)
  • Route-level permissioning
  • Content restriction (UI) based on user profile

CRUD, pagination, filters

Skills

• Responsive CRUD
  • Data listing
  • Form
  • Insertion, editing and removal
• Communication between components with events (observer pattern)
• React Hook Form
• Integration of libs with React Hook Form
  • React Select
  • React Currency Input Field
• Other libs
  • React Pagination
  • React Toastfy
• Data filtering
• Reference control with useCallback hook

Testing and deployment

Skills

• JEST and Testing Library
• JS/TS function tests
  • Test execution, watch mode
  • Describe block and test suite
  • Mock functions with spyOn
• React component testing
  • Unit and integration tests
  • Mock functions with jest.fn()
  • Mock requests with MSW
  • React Router DOM Mock
  • User interaction simulation
  • Fixtures
  • Form inputs
  • Form submission
• Deployment with CI/CD -Netlify