├── .eslintrc.json
├── src
├── app
│ ├── favicon.ico
│ ├── actions.js
│ ├── layout.tsx
│ ├── globals.css
│ ├── page.tsx
│ └── components
│ │ └── UsePhpClientComponent.tsx
└── tsconfig.json
├── next.config.js
├── postcss.config.js
├── docker-compose.yml
├── .gitignore
├── tailwind.config.ts
├── public
├── vercel.svg
└── next.svg
├── tsconfig.json
├── package.json
├── LICENSE
└── README.md
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "next/core-web-vitals"
3 | }
4 |
--------------------------------------------------------------------------------
/src/app/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/bufferhead-code/nextjs-use-php/HEAD/src/app/favicon.ico
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('next').NextConfig} */
2 | const nextConfig = {}
3 |
4 | module.exports = nextConfig
5 |
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/src/app/actions.js:
--------------------------------------------------------------------------------
1 | 'use server'
2 |
3 | export async function phpHelloWorld() {
4 | 'use php'
5 | print "Hello from PHP";
6 | }
7 |
--------------------------------------------------------------------------------
/docker-compose.yml:
--------------------------------------------------------------------------------
1 | version: '3.8'
2 |
3 | services:
4 | db:
5 | image: mysql:8.0
6 | command: --default-authentication-plugin=mysql_native_password
7 | restart: always
8 | environment:
9 | MYSQL_ROOT_PASSWORD: root
10 | ports:
11 | - "33066:3306"
--------------------------------------------------------------------------------
/src/app/layout.tsx:
--------------------------------------------------------------------------------
1 | import type { Metadata } from 'next'
2 | import { Inter } from 'next/font/google'
3 | import './globals.css'
4 |
5 | const inter = Inter({ subsets: ['latin'] })
6 |
7 | export const metadata: Metadata = {
8 | title: 'Create Next App',
9 | description: 'Generated by create next app',
10 | }
11 |
12 | export default function RootLayout({
13 | children,
14 | }: {
15 | children: React.ReactNode
16 | }) {
17 | return (
18 |
19 | {children}
20 |
21 | )
22 | }
23 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 | .yarn/install-state.gz
8 |
9 | # testing
10 | /coverage
11 |
12 | # next.js
13 | /.next/
14 | /out/
15 |
16 | # production
17 | /build
18 |
19 | # misc
20 | .DS_Store
21 | *.pem
22 |
23 | # debug
24 | npm-debug.log*
25 | yarn-debug.log*
26 | yarn-error.log*
27 |
28 | # local env files
29 | .env*.local
30 |
31 | # vercel
32 | .vercel
33 |
34 | # typescript
35 | *.tsbuildinfo
36 | next-env.d.ts
37 |
38 | *.original
--------------------------------------------------------------------------------
/tailwind.config.ts:
--------------------------------------------------------------------------------
1 | import type { Config } from 'tailwindcss'
2 |
3 | const config: Config = {
4 | content: [
5 | './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
6 | './src/components/**/*.{js,ts,jsx,tsx,mdx}',
7 | './src/app/**/*.{js,ts,jsx,tsx,mdx}',
8 | ],
9 | theme: {
10 | extend: {
11 | backgroundImage: {
12 | 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
13 | 'gradient-conic':
14 | 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
15 | },
16 | },
17 | },
18 | plugins: [],
19 | }
20 | export default config
21 |
--------------------------------------------------------------------------------
/public/vercel.svg:
--------------------------------------------------------------------------------
1 |
7 |
23 | )
24 | }
25 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) Bufferhead (Gregor Vostrak)
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
--------------------------------------------------------------------------------
/public/next.svg:
--------------------------------------------------------------------------------
1 | ('');
9 |
10 | async function onClick() {
11 | const out: string = await phpHelloWorld();
12 | setOutput(out);
13 | }
14 |
15 | return (
16 |
17 |
18 |
19 | Add your comment
20 |
21 |
22 |
29 |
30 |
31 |
36 | Execute PHP
37 |
38 |
{
20 | 'use php'
21 | (new PDO('mysql:host=localhost:3306;dbname=public', 'root', 'root'))
22 | ->prepare("INSERT INTO Bookmarks (slug) VALUES (?)")
23 | ->execute(array('new'));
24 | }}>
25 | Insert Bookmark
26 |
27 | )
28 | ```
29 |
30 | And if you want to it can even work with React Client Components
31 |
32 | ```javascript
33 | // actions.js
34 | 'use server'
35 |
36 | export async function phpHelloWorld() {
37 | 'use php'
38 | print "Hello from PHP";
39 | }
40 | ```
41 |
42 | ```javascript
43 | // page.tsx
44 | import {phpHelloWorld} from "../actions";
45 | ```
46 |
47 |
48 | Yes this actually works. Trust me I wish it wouldn't too.
49 |
50 | ## Build
51 |
52 | You can build the implementation by
53 |
54 | ```bash
55 | npm run build
56 | npm run start
57 | ```
58 |
59 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
60 |
61 | If you want to try out the Database Example, you can use the docker-compose file provided in the repository.
62 | after `docker-compose up -d` you need to create the database and table you want to insert into manually.
63 |
64 | ## Roadmap (Things that should be fixed but realistically it will never happen)
65 |
66 | - [ ] There is a probably a way to fix that nasty preprocess step with [SWC Plugins]( https://swc.rs/docs/plugin/ecmascript/getting-started) which are still in Beta with Next.js and also I think they will switch builder anyways soon so what's the point really? But hey if anyone wants to do it feel free.
67 | - [ ] I guess there is some hacky way to make props binding possible.
68 |
69 | ## Credits
70 |
71 | Check out the original implementations by elnardu for C and Rust:
72 |
73 | * https://github.com/elnardu/react-use-c
74 | * https://github.com/elnardu/react-use-rust
75 |
76 | ## Disclaimer
77 |
78 | *I hope I don't have to say this but: If you even in the slightest consider to use this in any application at all you are an absolute madperson and and should be locked out of the internet for the rest of your life, I hope you find some other fun activity, maybe gardening or woodwork.*
79 |
80 | ## Self-Promo
81 |
82 | If you enjoyed this project and want to see more silly web development projects, you can follow me on [Twitter](https://twitter.com/bufferhead_), [Bluesky](https://bsky.app/profile/bufferhead.bsky.social) and [Youtube](https://www.youtube.com/@bufferhead_).
83 |
--------------------------------------------------------------------------------