Skip to content

Instantly share code, notes, and snippets.

View Maxim-Kolmogorov's full-sized avatar
☺️
I love my job

Maxim Kolmogorov Maxim-Kolmogorov

☺️
I love my job
16 followers · 0 following
View GitHub Profile
@Maxim-Kolmogorov
Maxim-Kolmogorov / index.php
Created November 6, 2022 09:41
Laravel 9 + Vite + Vue.js + SSR = example, part 10
<?php
// Вместо div app в welcome.blade.php
$output = shell_exec('/Users/maximkolmogorov/.nvm/versions/node/v16.15.0/bin/node ../bootstrap/ssr/server-app.mjs ' . $url);
echo $output;
?>
@Maxim-Kolmogorov
Maxim-Kolmogorov / web.php
Created November 6, 2022 09:37
Laravel 9 + Vite + Vue.js + SSR = example, part 9
<?php
use Illuminate\Support\Facades\Route;
use Illuminate\Http\Request;
Route::get('/', function (Request $request) {
return view('welcome', [
'url' => $request->path()
]);
});
@Maxim-Kolmogorov
Maxim-Kolmogorov / router.js
Last active November 6, 2022 10:45
Laravel 9 + Vite + Vue.js + SSR = example, part 8
import { createWebHistory, createMemoryHistory, createRouter } from 'vue-router';
const isServer = typeof window === 'undefined';
const history = isServer ? createMemoryHistory() : createWebHistory();
import Home from './pages/Home.vue';
import About from './pages/About.vue';
const routes = [
{ path: '/', name: 'home', component: Home },
@Maxim-Kolmogorov
Maxim-Kolmogorov / server-app.js
Last active November 20, 2022 17:45
Laravel 9 + Vite + Vue.js + SSR = example, part 7
/* global var process from node */
import { createSSRApp } from 'vue'
import { renderToString } from 'vue/server-renderer'
import router from './router.js';
import App from './App.vue';
(async function main() {
const requestUrl = process.argv[2] || '/';
@Maxim-Kolmogorov
Maxim-Kolmogorov / app.js
Last active November 6, 2022 09:40
Laravel 9 + Vite + Vue.js + SSR = example, part 6
import './bootstrap';
import { createApp } from 'vue';
import router from './router.js';
import App from './App.vue';
const app = createApp(App);
app.use(router);
app.mount('#app');
@Maxim-Kolmogorov
Maxim-Kolmogorov / App.vue
Last active November 6, 2022 09:40
Laravel 9 + Vite + Vue.js + SSR = example, part 5
<template>
<!-- Типо template -->
<div id="app">
<!-- Навигация -->
<nav class="flex flex-wrap">
<router-link
:to="'/'"
>
Главная
</router-link>
@Maxim-Kolmogorov
Maxim-Kolmogorov / About.vue
Last active November 6, 2022 09:39
Laravel 9 + Vite + Vue.js + SSR = example, part 4
<template>
<div>
<h1>About</h1>
<section class="text-xl mb-12">
<p class="mb-8">
This is a quick demo app for server side rendering Vue with Laravel. Below is a list of our open source packages, which our client-side app has
divided by type.
</p>
</section>
</div>
@Maxim-Kolmogorov
Maxim-Kolmogorov / Home.vue
Last active November 6, 2022 09:39
Laravel 9 + Vite + Vue.js + SSR = example, part 3
<template>
<div>
<h1>SSR with Laravel & Vue </h1>
<section class="text-xl mb-12">
<p class="mb-8">
This is a quick demo app for server side rendering Vue with Laravel. Below is a list of our open source packages, which our client-side app has
divided by type.
</p>
<p>
We're using vue-router for this page so each package type has its own permalink, and will be prerendered
@Maxim-Kolmogorov
Maxim-Kolmogorov / router.js
Last active November 6, 2022 10:39
Laravel 9 + Vite + Vue.js + SSR = example, part 2
import { createWebHistory, createRouter } from 'vue-router';
import Home from './pages/Home.vue';
import About from './pages/About.vue';
const routes = [
{ path: '/', name: 'home', component: Home },
{ path: '/about', name: 'about', component: About },
];
@Maxim-Kolmogorov
Maxim-Kolmogorov / welcome.blade.php
Last active November 6, 2022 09:39
Laravel 9 + Vite + Vue.js + SSR = example, part 1
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello Blade</title>
@vite('resources/sass/app.scss')
</head>
<body>