Skip to content

Commit 0340da4

Browse files
MortaroMortaro
authored
Merge pull request #255 from brunolm/master
Add Examples section
2 parents 69c3c1e + 7579a39 commit 0340da4

20 files changed

+413
-0
lines changed

‎i18n/en-US/articles/server-request-and-response.md‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,22 @@ class Application extends Nullstack {
7979
export default Application;
8080
```
8181

82+
It's also possible to expose server functions from your components to be in the web API. Instead of using a function that a `request` and a `response` pass the static function from your component to the express route.
83+
84+
```js
85+
// server.js
86+
import Nullstack from 'nullstack';
87+
import Application from './src/Application';
88+
import WaifuComponent from './src/WaifuComponent';
89+
90+
const context = Nullstack.start(Application);
91+
92+
context.server.get('/waifus', WaifuComponent.getWaifus)
93+
94+
export default context;
95+
```
96+
97+
8298
## Next step
8399

84100
⚔ Learn about [styles](/styles).

‎i18n/en-US/components/Examples.yml‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
title: "Nullstack Examples"
2+
description: "Check coolest stuff you can do with Nullstack"
3+
heading: "Nullstack Examples"
4+
tagline: "A collection of application examples with Nullstack."
5+
contribute: "We accept guest examples! You can write it up in markdown and open a PR to our <a href='https://github.com/nullstack/nullstack.github.io/pulls'>github repo</a>."
6+
posts:
7+
- title: "Using Nullstack as a Web API"
8+
href: "/examples/using-nullstack-as-a-web-api"
9+
description: "Nullstack can be used as a web API, you can write your own endpoints or expose server functions."
10+
- title: "Using Nullstack to build a Chrome Extension"
11+
href: "/examples/using-nullstack-to-build-a-chrome-extension"
12+
description: "Nullstack can be used to build a Chrome Extension."
13+
- title: "Using Nullstack to build a Desktop Application"
14+
href: "/examples/using-nullstack-to-build-a-desktop-application"
15+
description: "Nullstack can be used to build a Desktop Application."
16+
- title: "Using Nullstack to build a Mobile Application"
17+
href: "/examples/using-nullstack-to-build-a-mobile-application"
18+
description: "Nullstack can be used to build a Mobile Application."
19+
- title: "Using Nullstack to build a personal Portfolio on GitHub"
20+
href: "/examples/using-nullstack-to-build-a-personal-portfolio-on-github"
21+
description: "Nullstack can be used to build a personal Portfolio on GitHub."

‎i18n/en-US/components/Header.yml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ links:
66
href: "/what-is-nullstack"
77
- title: "Documentation"
88
href: "/getting-started"
9+
- title: "Examples"
10+
href: "/examples"
911
- title: "Blog"
1012
href: "/blog"
1113
- title: "Contributors"

‎i18n/en-US/examples/404.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
title: Page Not Found
3+
description: Sorry, this is not the page you are looking for.
4+
status: 404
5+
---
6+
7+
Perhaps you want to learn more about [Nullstack](/what-is-nullstack)?
8+
9+
Or do you want to contribute to our [blog](/blog)?

‎i18n/en-US/examples/using-nullstack-as-a-web-api.md‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
---
2+
title: "Using Nullstack as a Web API"
3+
description: "Nullstack can be used as a web API, you can write your own endpoints or expose server functions."
4+
---
5+
Nullstack can be used as a Web API. Nullstack runs an Express server behind the scenes allowing you to configure your own routes and build a fully customized Web API.
6+
7+
You can configure the Express routes by using the `server` object available in the Nullstack Context on `server.js`.
8+
9+
```js
10+
// server.js
11+
import Nullstack from 'nullstack';
12+
import Application from './src/Application';
13+
14+
const context = Nullstack.start(Application);
15+
16+
context.server.get('/api/waifus', (request, response) => {
17+
response.json({waifus: []});
18+
});
19+
20+
export default context;
21+
```
22+
23+
It's also possible to expose server functions from your components to be in the web API. Instead of using a function that a `request` and a `response` pass the static function from your component to the express route.
24+
25+
```js
26+
// server.js
27+
import Nullstack from 'nullstack';
28+
import Application from './src/Application';
29+
import WaifuComponent from './src/WaifuComponent';
30+
31+
const context = Nullstack.start(Application);
32+
33+
context.server.get('/waifus', WaifuComponent.getWaifus)
34+
35+
export default context;
36+
```

‎i18n/en-US/examples/using-nullstack-to-build-a-chrome-extension.md‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
title: "Using Nullstack to build a Chrome Extension"
3+
description: "Nullstack can be used to build a Chrome Extension"
4+
---
5+
Nullstack can be used as to build a Chrome Extension.
6+
7+
These are all the changes required to make the app compatible as an extension:
8+
9+
- `public/manifest.json` creates the Chrome Extension manifest file
10+
- `server.js` disables the default service worker, as the extension doesn't need it
11+
- `src/Application.jsx` is the entry component that will render the Popup code
12+
- `package.json` sets mode to SPA (default mode) and enables writing files to disk
13+
14+
You can find a full example at [Mortaro/nullstack-chrome-extension](https://github.com/Mortaro/nullstack-chrome-extension).

‎i18n/en-US/examples/using-nullstack-to-build-a-desktop-application.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
title: "Using Nullstack to build a Desktop Application"
3+
description: "Nullstack can be used to build a Desktop Application"
4+
---
5+
Nullstack can be used as to build a Desktop Application with Electron.
6+
7+
If you'd like to help complete this example, feel free to [send us a PR](https://github.com/nullstack/nullstack.github.io).

‎i18n/en-US/examples/using-nullstack-to-build-a-mobile-application.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
title: "Using Nullstack to build a Mobile Application"
3+
description: "Nullstack can be used to build a Mobile Application"
4+
---
5+
Nullstack can be used as to build a Mobile Application.
6+
7+
If you'd like to help complete this example, feel free to [send us a PR](https://github.com/nullstack/nullstack.github.io).

‎i18n/en-US/examples/using-nullstack-to-build-a-personal-portfolio-on-github.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
title: "Using Nullstack to build a personal Portfolio on GitHub"
3+
description: "Nullstack can be used to build a personal Portfolio on GitHub"
4+
---
5+
Nullstack can be used to build a personal Portfolio on GitHub.
6+
7+
Check out how to [deploy your website to GitHub pages](/how-to-deploy-to-github-pages).
8+
9+
If you'd like to help complete this example, feel free to [send us a PR](https://github.com/nullstack/nullstack.github.io).

‎i18n/pt-BR/components/Examples.yml‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
title: "Nullstack Examples"
2+
description: "Check coolest stuff you can do with Nullstack"
3+
heading: "Nullstack Examples"
4+
tagline: "A collection of application examples with Nullstack."
5+
contribute: "We accept guest examples! You can write it up in markdown and open a PR to our <a href='https://github.com/nullstack/nullstack.github.io/pulls'>github repo</a>."
6+
posts:
7+
- title: "Using Nullstack as a Web API"
8+
href: "/examples/using-nullstack-as-a-web-api"
9+
description: "Nullstack can be used as a web API, you can write your own endpoints or expose server functions."
10+
- title: "Using Nullstack to build a Chrome Extension"
11+
href: "/examples/using-nullstack-to-build-a-chrome-extension"
12+
description: "Nullstack can be used to build a Chrome Extension."
13+
- title: "Using Nullstack to build a Desktop Application"
14+
href: "/examples/using-nullstack-to-build-a-desktop-application"
15+
description: "Nullstack can be used to build a Desktop Application."
16+
- title: "Using Nullstack to build a Mobile Application"
17+
href: "/examples/using-nullstack-to-build-a-mobile-application"
18+
description: "Nullstack can be used to build a Mobile Application."
19+
- title: "Using Nullstack to build a personal Portfolio on GitHub"
20+
href: "/examples/using-nullstack-to-build-a-personal-portfolio-on-github"
21+
description: "Nullstack can be used to build a personal Portfolio on GitHub."

0 commit comments

Comments
 (0)