Criando uma rota com SFCC

artigo

Criando uma rota com SFCC

Publicado em: 04/05/2023
avatar do autor
By Wagner Silva
/wagstalos

Neste artigo, vamos explicar como criar uma rota com SFCC e como exibir informações na página web usando a biblioteca Server.js.

Para criar uma rota usando o Server.js, primeiro precisamos importar o módulo do servidor, como mostrado no exemplo abaixo:

⁠'use strict'
var server = require('server')

Em seguida, podemos definir uma rota usando o método 

get()

do servidor. Neste exemplo, criamos uma rota chamada 

Show

que renderiza uma visualização 

testview

com as informações da pessoa:

⁠server.get('Show', function (req, res, next) {

let person = {

id: 1,

firstName: 'Wagner',

lastName: 'Silva',

age : 19,

street: 'Rua Salesforce',

emailIds: ["w@ibm.com", "silva@ibm.com" , "wps@ibm.com", 'wagst@hotmail.com', 'email@email.com']

}

res.render('hello/testview', {person} );

next();

});


Neste exemplo, criamos um objeto person com informações sobre a pessoa e renderizamos a visualização testview, passando o objeto person como um parâmetro. O método next() é usado para permitir que outras funções do middleware sejam executadas após a rota.

Agora, podemos exibir as informações da pessoa na visualização testview usando a sintaxe do Server.js. Para exibir as informações de uma variável, usamos a tag <isset> para definir a variável e seu valor. Neste exemplo, definimos a variável person como o objeto person que foi passado como um parâmetro para a visualização:

    <isset name="person" value="${pdict.person}" scope="page" />
    <p>id: ${person.id}</p>
    <p>Name: ${person.firstName}</p>
    <p>Sobrenome: ${person.lastName}</p>
    <p>Idade: ${person.age}</p>
    <p>Street: ${person.street}</p>
    <p>Email principal: ${person.emailIds[0]}</p>


Podemos usar a tag 

<isloop>

para iterar sobre uma matriz e exibir todos os seus elementos. Neste exemplo, usamos a tag 

<isloop>

para exibir todos os emails secundários da pessoa:

<p>Emails secundarios</p>

    <isloop begin="${1}" items="${person.emailIds}" var="email" status="loopstatus"  >
        <li>${email}</li>
    </isloop>



Além disso, podemos usar a tag 

<isif>

para testar uma condição e exibir um bloco de código dependendo do resultado. Neste exemplo, usamos a tag 

<isif>

para verificar se a idade da pessoa é maior ou igual a 18 e exibir se ela está liberada ou não:

<isif condition = "${person.age >= 18}">
<p>Liberado</p>
<iselse>
<p>Não liberado</p>
</isif>