Build your first prototype, an "About Me" page, by following our step-by-step guide.
A page is created for every file in the pages folder. The easiest way to create a new page is by duplicating an existing one.
Make a new page using "Template Page":
pages folder.about-me.js template-page.js file and copy all of its contents.about-me.js fileCongratulations! You just made your first new page on Paste.
To navigate to your new "About Me" page, a link to it must be included in the navigation bar. Links for the navigation are edited in the pages.json file in the pages folder.
To add a link to the "About Me" page:
pages.json file."template-page": [] - and add a comma to the end of the line, so that it reads "template-page": [],. Then press return to make a new line."about-me": [] in the new line.about-me.js.Once you save your work, a new "About Me" link will pop up in the navigation!
Finish your demo by clicking on your new "About Me" navigation link to edit the page's contents.
The prototyping kit is a NextJS app with Paste preloaded. It has everything you will need to create a fully functioning web based prototype using Paste components
Create pages in the pages directory. You can copy the template-page.js file and rename it as my-new-page.js to get you going. The name of the file in the pages directory will result in a route of the same name. e.g. my-new-page.js => /my-new-page.
To add a link to a new page in the side bar, add the new page's file name to the pages.json file in the pages directory. Make sure it is in quotes and followed by : []. For example:
"my-new-page": []
Note: if you are adding to the middle of the list, end the new line with a comma. If it is the last list item, do not end the line with a comma.
Internal linking: Use the <PrototypeAnchor /> not the Paste Anchor. It is a wrapper around the Paste Anchor suitable for NextJS websites. It looks and behaves exactly like a Paste Anchor.
The prototyping kit can be quickly deployed to the following platforms:
