Loading...
miriyan77 avatar miriyan77 0 Точки

JS Apps - Exercise: Routing Implement Furniture Store

Опитвам се да реша задачата 'Implement Furniture Store' от упражнението след лекцията за раутинга в курса
по JS App като следвам решението на Виктор Костадинов от видеото от 16 март 2021г, 
но моето решение се чупи още в самото начало и не мога да разбера защо.
Инсталирал съм локално live-server, както и библиотеката page.js.
Сървърът е пуснат и работи нормално на порт 8080. Архитектурата е в най-начална фаза
и е съвсем елементарна - един файл index.html, папка src, в която има файл app.js,
като и вмъкната папка views също с един файл - register.js.

В register.js има един ред код - export function registerPage(){ console.log('REGISTER'); }

В app.js -

import page from '../node_modules/page/page.mjs';
import { registerPage } from './views/register.js'; 
page('/register',registerPage); 
page.start();

В head тага в index.html съм написал <script src="./src/app.js" type="module"></script>

Очаквах че като отида на http://localhost:8080/register ще намеря надписа REGISTER в конозолата,

но вместо това получих 404 (Not Found), а в самата уеб страница се изписа Cannot GET /register.

Ще съм благодарен, ако някой може да ми покаже грешката ми или поне на някакви насоки къде да я търся. 

0
JavaScript Applications
Axiomatik avatar Axiomatik 2422 Точки

Make sure that both servers are running, Viktor's custom back-end server (port 3000 or 3030) and VS-Code live server (port 5500) I think was the setup for that video. Codewise, it seems correct what you have implemented, especialy when the homepage is showing up on localhost://8080.

This was my version of app.js from that lecture, hope it helps somehow:

import page from '../node_modules/page/page.mjs';
import { render } from '../node_modules/lit-html/lit-html.js';

import { logout } from './api/data.js';
import { createPage } from './views/create.js';
import { dashboardPage } from './views/dashboard.js';
import { detailsPage } from './views/details.js';
import { editPage } from './views/edit.js';
import { registerPage } from './views/register.js';
import { loginPage } from './views/login.js';
import { myPage } from './views/myFurniture.js';

const main = document.querySelector('.container');

// View Controller (module)
// fetch data
// interpolate template
// handle user input
// return content / render content

// returns same page
// page('/', dashboardPage);
page('/', decorateContext, dashboardPage);
// page('/dashboard', dashboardPage);

// dynamic route
page('/details/:id', decorateContext, detailsPage);
page('/create', decorateContext, createPage);
page('/edit/:id', decorateContext, editPage);
page('/register', decorateContext, registerPage);
page('/login', decorateContext, loginPage);
page('/my-furniture', decorateContext, myPage);

document.getElementById('logoutBtn').addEventListener('click', async () => {
    await logout();
    setUserNav();
    page.redirect('/');
});

setUserNav();
page.start();

function decorateContext(ctx, next) {
    ctx.render = (content) => render(content, main);
    ctx.setUserNav = setUserNav;
    next();
}

function setUserNav() {
    const userId = sessionStorage.getItem('userId');
    if (userId !== null) {
        document.getElementById('user').style.display = 'inline-block';
        document.getElementById('guest').style.display = 'none';
    } else {
        document.getElementById('user').style.display = 'none';
        document.getElementById('guest').style.display = 'inline-block';
    }
}

 

0
miriyan77 avatar miriyan77 0 Точки

Thank you for your swift answer, but I still can't make up my mind about all of this.
I forgot to mention that the rest service included in the resources to the task was
running, so that is not the problem. And I get it that it is not the code itself that makes
the trouble. It is something in the set up.

The general problem is perhaps that the server cannot run the function registerPage associated

with the path '/register' through the command    'page("/register", registerPage)',

because it cannot find the file register.js, where the function is, 

and the reason for this is what I want to try to understand.

0
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.