правильно ли я понимаю, что на этапе продакшена мы должны подключаться только к одному порту, на котором находится сервер, а он отправит html, css, js файлы при первом запросе на главную страницу а в дальнейшем будет отправлять JSON?В зависимости от настроек сервера и архитектуры твоего проекта. Экспресс может как отдавать хтмл/css,так и служить для обмена данными бека с фронтом(апи). Во втором случае за раздачу хтмл может отвечать какой-либо популярный веб-сервер, nginx/apache.
при использовании npm run build я получаю папку build, где много css и js файлов. Как эту папку надо связать с node.js
Допустим мы при первом запросе на сервер отправляем HTML файл. Но как клиент получит нужный ему css и js файл из кучи в папке build.все как в обычном html. Есть точка входа в виде хтмл-файла, к которой твой билдер уже привязал все стили/скрипты. Все это отдается клиенту.
import express from "express";
const app = express();
const ip = "localhost";
const port = 4000;
app.get("/", (req, res) => {
res.send("some response");
});
function startServer() {
app.listen(port, ip, () => {
console.log(`Сервер запущен на адресе ${ip} и порту ${port}`);
});
}
async function connectToDatabase() {
return new Promise((resolve, reject) => {
setTimeout(() => resolve("ok"), 2000);
});
}
connectToDatabase()
.then(() => {
startServer();
console.log("Успешное подключение к базе данных.");
})
.catch((err) => {
console.error("Не удалось подключиться к базе данных:", err);
});export function connectToDatabase() {
return new Promise((resolve, reject) => {
pool.connect((err, client, release) => {
if (err) {
console.error('Ошибка в запросе к БД (1)', err.stack);
release();
reject(err);
return;
}
client.query('SELECT NOW()', (err, result) => {
release();
if (err) {
console.error('Ошибка в запросе к БД (2)', err.stack);
reject(err);
return;
}
console.log('\x1b[34m%s\x1b[0m', `PostgreSQL is running (${result.rows[0].now})`);
resolve(pool);
});
});
});
}Применимы, но очень ограниченно, и смотря какой фреймворк используется у vue 3 и react кажется с 18 версии более удобно использовать хуки, превращать их в фабрики на мой взгляд бессмысленно лучше упороться в архитектуру разделенную на слои. Последний раз когда писал код подобными паттернами, была обертка над axios
//body html
<button>Button</button>
//css
button{
position: absolute;
top: 20px;
left: 20px;
}A common misbelief is that we can add a click event listener to an A-Frame entity and expect it to work by directly clicking on the entity with our mouse. In WebGL, we must provide the input and interaction that provides such click events. For example, A-Frame’s cursor component creates a synthetic click event on gaze using a raycaster. Or as another example, Mayo Tobita’s mouse-cursor component creates a synthetic click event when clicking directly on the entity using a raycaster.