|
1 |
| -# GOV.UK Prototyping Kit |
| 1 | +# DWP Digital Service Portfolio |
2 | 2 |
|
3 |
| -The kit provides a simple way to make interactive prototypes that look like pages on GOV.UK. These prototypes can be used to show ideas to people you work with, and to do user research. |
4 |
| - |
5 |
| -It's built on the [Express](http://expressjs.com/) framework, and uses these GOV.UK resources: |
6 |
| - |
7 |
| -- [GOV.UK template](https://github.com/alphagov/govuk_template) |
8 |
| -- [GOV.UK front end toolkit](https://github.com/alphagov/govuk_frontend_toolkit) |
9 |
| -- [GOV.UK elements](https://github.com/alphagov/govuk_elements) |
10 |
| - |
11 |
| -Read the [project principles](docs/principles.md). |
12 |
| - |
13 |
| -## Requirements |
14 |
| - |
15 |
| -#### [Node](http://nodejs.org/) |
16 |
| - |
17 |
| -You may already have it, try: |
18 |
| - |
19 |
| -``` |
20 |
| -node --version |
21 |
| -``` |
22 |
| - |
23 |
| -Your version should be 4.2.2. |
24 |
| - |
25 |
| -If you don't have Node, download it here: [http://nodejs.org/](http://nodejs.org/). |
26 |
| - |
27 |
| -## Getting started |
28 |
| - |
29 |
| -Install Node.js (see requirements) |
30 |
| - |
31 |
| -#### Download the prototype kit |
32 |
| - |
33 |
| -[Download the zip file](https://github.com/alphagov/govuk_prototype_kit/archive/master.zip) |
34 |
| - |
35 |
| -Unzip the file |
36 |
| - |
37 |
| -#### Install dependencies |
38 |
| - |
39 |
| -Open a command line app (Terminal on OSX) and change to the unzipped directory. Then run: |
40 |
| - |
41 |
| -``` |
42 |
| -npm install |
43 |
| -``` |
44 |
| - |
45 |
| -This will install extra code that the prototype kit needs. |
46 |
| - |
47 |
| -#### Run the app |
48 |
| - |
49 |
| -``` |
50 |
| -node start.js |
51 |
| -``` |
52 |
| - |
53 |
| -Go to [localhost:3000](http://localhost:3000) in your browser. |
54 |
| - |
55 |
| -If you want to view multiple prototypes at the same time you can give them unique port numbers, like this: |
56 |
| - |
57 |
| -``` |
58 |
| -PORT=3005 node start.js |
59 |
| -``` |
60 |
| - |
61 |
| -To avoid conflicts we recommend using ports between 3000 and 3009. To change the port number permanently, edit the port variable in /server.js. |
62 |
| - |
63 |
| -#### Hot reload |
64 |
| - |
65 |
| -Any code changes should update in the browser without you restarting the app. |
66 |
| - |
67 |
| -The app recompiles app/assets/stylesheets/application.scss everytime changes are observed. |
68 |
| - |
69 |
| -## Documentation |
70 |
| - |
71 |
| -- [Prototyping kit principles](docs/principles.md) |
72 |
| -- [Getting started](docs/getting-started.md) |
73 |
| -- [Making pages](docs/making-pages.md) |
74 |
| -- [Writing CSS](docs/writing-css.md) |
75 |
| -- [Deploying (getting your work online)](docs/deploying.md) |
76 |
| -- [Updating the kit to the latest version](docs/updating-the-kit.md) |
77 |
| -- [Tips and tricks](docs/tips-and-tricks.md) |
78 |
| -- [Creating routes (server-side programming)](docs/creating-routes.md) |
79 |
| - |
80 |
| -This project is built on top of Express, the idea is that it is straightforward to create simple static pages out of the box. However, you're not limited to that - more dynamic sites can be built with more understanding of Express. Here's a good [Express tutorial.](http://code.tutsplus.com/tutorials/introduction-to-express--net-33367) |
81 |
| - |
82 |
| -## Community |
83 |
| - |
84 |
| -We have two Slack channels for this app. You'll need a government email address to join them. |
85 |
| - |
86 |
| -* [Slack channel for users of the Prototype Kit](https://ukgovernmentdigital.slack.com/messages/prototype-kit/) |
87 |
| -* [Slack channel for developers of the Prototype Kit](https://ukgovernmentdigital.slack.com/messages/prototype-kit-dev/) |
| 3 | +[Take a look]() |
0 commit comments