IWA-Interview

Tran Minh Tuan

# Assignment
## Environment

### Backend
- Ruby 2.6.3
- Rails 6.0.3.2
- PostgreSQL) 12.3

### Frontend
- Angular: 10.0.5
- Angular CLI: 10.0.4
- Node: 12.6.0

## How to install

### Sources
- [Backend](https://github.com/trantuanckc/iwa-api)
- [Frontend](https://github.com/trantuanckc/iwa-client)

- Backend
  - Install based on the environment I have mentioned above
  - Rename file `config/application.example.yml` to `config/application.yml`
    - `rake secret` to get the value then update to variable `SECRET_KEY_BASE`
  - Check your `config/database.yml`
  - Run these commands
    - rake db:create
    - rake db:migrate
    - rake db:seed
    - rails s

- Frontend
  - Run `npm install` on root project FE
  - Update API endpoint on file `app.settings.ts`

```ruby
export class AppSettings {
  public static API = {
    v1: 'http://localhost:3000/api/v1'
  };
}
```

### Testing
- Use Postman test to make sure all APIs call successfully


## Document for API
|Method   |Path   |Version   |Description   |
|---------|-----------------------------------------------|------|----------------------------------------------------------|
    |   POST  |  /api/:version/sessions(.json)                |  v1  |  Authenticate user and return user object / access token |
    | DELETE  |  /api/:version/sessions/:access_token(.json)  |  v1  |  Destroy the access token                                |
    |   POST  |  /api/:version/registrations(.json)           |  v1  |  Create user                                             |
    |    GET  |  /api/:version/tests/:id/questions(.json)     |  v1  |  Get questions of a test                                 |
    |    GET  |  /api/:version/tests(.json)                   |  v1  |  Get all tests                                           |
    |    GET  |  /api/:version/tests/:id(.json)               |  v1  |  Get detail test                                         |
    |   POST  |  /api/:version/tests(.json)                   |  v1  |  Create a test                                           |
    | DELETE  |  /api/:version/tests/:id(.json)               |  v1  |  Delete a test                                           |
    |    PUT  |  /api/:version/tests/:id(.json)               |  v1  |  Update a test                                           |
    |    GET  |  /api/:version/users(.json)                   |  v1  |  Get all users                                           |
    |    PUT  |  /api/:version/users/:id(.json)               |  v1  |  Update a user                                           |
    |    GET  |  /api/:version/users/:id(.json)               |  v1  |  Get user detail                                         |
    | DELETE  |  /api/:version/users/:id(.json)               |  v1  |  Delete a user                                           |

#### Sample explain API for Mobile APP

1. Authenticate user and return user object / access token

`POST` `/api/:version/sessions(.json)`

`Params`

```ruby
{
  email: String,
  password: String
}
```

`Response`

```ruby
{
  {
  "id": Integer,
  "name": String,
  "email": String,
  "role": String,
  "auth": {
    "token": String,
    "expired": Integer
  }
}
```

`Sample Response`


```ruby
{
  "id": 1,
  "name": "Teacher 1",
  "email": "teacher@example.com",
  "role": "Teachers",
  "auth": {
    "token": "eyJhbGciOiJIUzI1NiJ9.eyJpZCI6MSwiZXhwIjoxNTk2MzU4MDQxfQ.-4EG5d2Xlhp3By18X8bNuTf8knJCuG6Q6MfSnc-O-1I",
    "expired": 1596358041
  }
}
```

## Live
- API: https://iwa-api.herokuapp.com/users
- UI: https://iwa-client.herokuapp.com/
- Account to log in:
  - email: `teacher@example.com`
  - password: `12345678`

### Problems when I created this project
- Take time to build project BE & FE from scratch
- There are more areas I want to develop in this assignment but given the limited time, this is what I have tried my best to deliver.

- [x] PG::ConnectionBad: could not connect to server: No such file or directory [resolved](https://medium.com/@yutafujii_59175/pg-connectionbad-could-not-connect-to-server-no-such-file-or-directory-9a2eada16f9)

```ruby
  brew postgresql-upgrade-database
```

- [x] undefined method `devise' for User (call 'User.connection' to establish a connection):Class (NoMethodError)

```
  rails generate devise:install

  add extend Devise::Models to user model (rails6)
```

  - https://medium.com/@yavuz255/rake-aborted-2da1233a4561

- [ ] SnakeCammel for paramerters API
  - https://www.rubydoc.info/gems/introspective_grape

- [x] Render angular without the tag wrap (list page)
  https://stackoverflow.com/questions/46671235/remove-host-component-tag-from-html-in-angular-4

Deploy Rails 6 to Heroku
- [x] heroku connections on Unix domain socket "/var/run/postgresql/.s.PGSQL.5432
  - https://stackoverflow.com/questions/45336844/error-when-run-migrations-on-heroku-postgresql-with-rails-5

- [x] Submit outside form
  - https://stackoverflow.com/questions/56358941/how-to-submit-reactive-form-from-outside-the-form-submitting-on-click-save-or-u/56359150

- [x] Deploy production
  - Caught error of type TypeError in after callback inside Grape::Middleware::Formatter : no implicit conversion of nil into String
  - Check all enviroment variables

## Should be improved

In order to complete this project it will take more time, however, I have noted down what I think can be improved but I haven’t got time to finish yet, nonetheless, it will help to manage the project better I believe.

### For API
- [ ] Custom handling error for API (60%)
  - https://stackoverflow.com/questions/26528688/grape-error-handling-strategy
- [ ] Optimize JSON for API
  - https://medium.com/@aboelleef/faster-json-apis-for-your-ruby-on-rails-application-1ed06f6bb27a
- [ ] Automation testing (Currently test on Postman)
- [ ] Pagination for API (User Pagy)
- [ ] Remember Me
- [ ] Check index optimize for each table
- [ ] Optimize N+
- [ ] Create error 404.. default page
- [ ] Good Documetation for API https://github.com/ruby-grape/grape-swagger

### For UI (Angular)
- [x] Auto logout
- [x] Auto login
- [x] Logout
- [x] Auto redirect to users page if user is loging
- [x] Resolver service
- [x] Define API constant
- [x] Dynamic form
- [x] Interceptor for force logout when token expired
- [ ] Add document API for mobile (50%)
- [ ] Handel error or loading for login form
  - https://viblo.asia/p/angular-resolving-route-data-1VgZv319lAw
- [ ] Lazy load Component
- [ ] Loading spin
- [ ] Dynamic menu action on CRUD page
- [ ] Learning more Subscription, Subject
- [ ] canDeactivate when form is editing
- [ ] Split project to module
- [ ] Resposive
- [ ] Hamburger icon
- [ ] Dynamic component (alert message)
- [ ] ngrx (apply redux - store) easy scable & mantaince
- [ ] Maybe confirmation alert before delete
- [ ] Empty message when page list is empty
- [ ] Rack attact

### Working
- Update Tests

### Bug
#### Backend
- [x] Do not delete yourself
- [ ] Bug when update myself change current role from `Teachers` to `Students`

#### Frontend
- [ ] Missing delete button on the test detail page


### Relate info
- Considering to use `angular-jwt` for Angular
  - https://medium.com/@ryanchenkie_40935/angular-authentication-using-route-guards-bf7a4ca13ae3