diff --git a/app/views/how-tos/index.html b/app/views/how-tos/index.html index cff4f11c..f079f1cd 100755 --- a/app/views/how-tos/index.html +++ b/app/views/how-tos/index.html @@ -48,6 +48,12 @@
+ If you have learned how to use the GOV.UK Prototype Kit, you will be able to use the NHS.UK prototype kit. This is because the two prototype kits are built in the same way. However, you must do some things differently. +
++When you are installing and running your prototype: + +{{ list({ + title: "Do", + type: "tick", + items: [ + { + item: 'download the kit using the zip file or Github' + }, + { + item: 'check when you install your prototype that you are using the right version of Node.js - you may need to install and use a different version. If you need to make prototypes for both NHS.UK and GOV.UK you can switch versions of node with a node version manager' + }, + { + item: 'start your local server by entering in the terminal:
npm run watch
'
+ }
+ ]
+}) }}
+
+{{ list({
+ title: "Don’t",
+ type: "cross",
+ items: [
+ {
+ item: 'try to install the prototype kit using the terminal as it will not work'
+ },
+ {
+ item: 'start your local server the same way as in the GOV.UK Prototype Kit as it will not work'
+ }
+ ]
+}) }}
+
+
+
++ When you are making pages: +
+ +{{ list({ + title: "Do", + type: "tick", + items: [ + { + item: 'use the NHS.UK design system for styles, components and patterns - you can also copy template pages in the NHS prototype kit' + }, + { + item: 'use NHS.UK macro naming conventions which do not have a prefix, for example{{ radios }}
instead of {{ govukRadios }}
'
+ },
+ {
+ item: 'use NHS.UK typography classes on headings and other text, for example ' + 'nhsuk-body
' | escape + '
'
+ },
+ {
+ item: 'know that the NHS.UK prototype kit does not have some functionality that is in the GOV.UK one, for example the interface to create pages from templates'
+ },
+ {
+ item: 'know that plugins designed for the GOV.UK Prototype Kit may not work or may need to be installed differently - for example, if you want to use the GOV.UK Prototype Kit Filters plugin you must use instructions for earlier versions of the kit and make changes in filters.js
.'
+ }
+ ]
+}) }}
+
+{{ list({
+ title: "Don’t",
+ type: "cross",
+ items: [
+ {
+ item: 'copy pages from the GOV.UK design system or GOV.UK prototype kit and expect them to work - you may need to copy over extra code like CSS to make them work properly'
+ },
+ {
+ item: 'use GOV.UK macro naming conventions as they will not work'
+ },
+ {
+ item: 'use GOV.UK typography classes as they will not work'
+ }
+ ]
+}) }}
+You can define routes to do branching logic or other custom behaviour in the same way as the GOV.UK Prototype Kit.
+ +You can also add default session data in data/session-data-defaults.js
Unlike the GOV.UK Prototype Kit, if you save any changes the the routes file, the app will restart and any session data will revert to the default.
+ +If you have any problems, ask a developer on your team (if you have one), email us or get in touch on the NHS digital service manual #prototype-kit Slack channel.
+ + {% include "how-tos/includes/back-button.html" %} + +