1c566e0ec4
* First draft - all the big changes * Changing some more references to 'internal' * Relocate internal request tests to admin * Relocate internal system tests to admin * Fix trailing space * Test fix * Move queries from internal to admin * Docs updates * Rename internal stimuls controllers to admin (plus docs) * Rename admin layout * Fix routing after rebase * Fixes for latest added admin interfaces * Serviceworker ignore paths
1.5 KiB
| title |
|---|
| Admin User Interface |
User Interface
Our admin dashboard is primarily ERB views that render on the server. Largely, we try to adhere to ActionView's conventions in these views.
For layout, basic styles, and some interactions, we use Bootstrap 4. Forem isn't dedicated to using Bootstrap for everything, but because our design team hasn't spent much time on these views, we find it's easier to stick with something many developers already know.
When a view requires some custom interactivity, we've historically leaned on vanilla JavaScript or jQuery, but going forward we've elected to use StimulusJS for DOM manipulation and interactivity inside of admin.
Forms
Inside of the admin views, we're
actively moving from the old ERB syntax for forms.
We tend to prefer the form_with helper over the previous form_for and
form_tag helpers.
StimulusJS
Stimulus is a modest frontend framework; its primary purpose is manipulating HTML. It does not provide templating features.
In the Forem application, Webpacker is used to load Stimulus controllers. Ideally, controllers serve as an abstraction for shared functionality between views.
New controllers can be added in /app/javascript/admin/controllers. Unit tests
should exist for each controller in the adjacent
/app/javascript/admin/__tests__/contollers directory.