Best practices for altinn.studio frontend
Altinn.studio best practices will be updated with more and better practices ;)
- Simple lists should be sorted alphabetically
All logic used in a saga should be an exported function in the
utils-folder. This is decided since we need to split up the logic from the fetching of data, so we have a more testable codebase. The saga only fetches data from the state, and sends the appropriate data to utils-functions.
This is the best practice for folder structure in applications. Note that this is not necessarily how the folder structure is for all the apps, but when creating anything new, or cleaning up, this is how it should look.
- src / - config / - config.json - exportedConfig.js - features / # routes,pages,features - [featureName] / - components / - containers / - resources / - featureSpecificData / - delete / - deleteFeatureSpecificDataActions.ts - deleteFeatureSpecificDataSagas.ts - fetch / - ... - upload / - ... - featureSpecificDataActions.ts - featureSpecificDataActionTypes.ts - featureSpecificDataReducers.ts - featureSpecificDataSagas.ts - selectors / - getSomeResourceSelector.ts - reducers / - featureNameReducer.ts - utils / # Feature specific utils - formFiller / # Example feature - components / - containers / - resources - attachments / # FileUpload example - delete / - deleteAttachmentsActions.ts - deleteAttachmentsSagas.ts - fetch / - fetchAttachmentsActions.ts - ... - upload / - ... - attachmentsActions.ts - attachmentsActionTypes.ts - attachmentsReducers.ts - attachmentsSagas.ts - selectors / - getSomeResouceSelector.ts - reducers / - formfillerReducer.ts - utils / - reducers / - index.ts - shared / - components / # Shared components - resources / # Shared resources - [resourceName] / - [action] / - <action><resourceName>Actions.ts - <action><resourceName>Sagas.ts - <resourceName>Actions.ts - <resourceName>ActionTypes.ts - <resourceName>Reducer.ts - <resourceName>Sagas.ts - language / # example resource - fetch / - fetchLanguageActions.ts - fetchLanguageSagas.ts - someAction / - someActionOnLanguageActions.ts - someActionOnLanguageSagas.ts - languageActions.ts - languageActionTypes.ts - languageReducer.ts - languageSagas.ts - types / - utils / - store - types - utils