Yugal Router
By routing pages you can easily navigate between methods with custom urls. This requires some additional configurations.
Paste the code below in your
.htaccess
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.php [L,QSA]
Edit file extension of index.php in .htaccess according to your project.
You need to pass
uri
parameter in page methods for customurls
. Example for Defining URI parameter in Page Method
function HomePage(){
return{
render: `<h1>HELLO WORLD</h1>`,
uri: 'home.html' //THIS WILL BE CUSTOM PAGE NAME FOR URLS
};
}
HOW TO USE yugal.router
?
yugal.router
must be called after the page is completely loaded, so that there is no error. For this addEventListener
must be used. Example
window.addEventListener("load", ()=>{
yugal.router();
});
However in above example, blank parameter could cause some error, so this code will not work, refer to examples below.
USAGE
yugal.router
accepts an object
as parameter, with initial
, error404
and screens
as parameters.
initial
: accepts the page method which must be renderred if no pointed page is defined in URLerror404
: accepts the page method which must be renderred when router can't find any page method with URI parameter which is called by URL. (OPTIONAL)screens
: accepts an array of all page methods.
Example
function ErrorPage(){
return{
render: `<h1>ERROR!</h1>`
};
}
function AboutPage(){
return{
render: `<h1>ABOUT PAGE</h1>`,
uri: 'about'
};
}
function HomePage(){
return{
render: `<h1>HELLO WORLD</h1>`,
uri: 'index'
};
}
window.addEventListener("load", ()=>{
yugal.router({
initial: ()=>HomePage(),
error404: ()=>ErrorPage(),
screens: [
HomePage,
AboutPage
]
});
});
Don't use yugal.navigate
barely to initially render a method, as this is handled by yugal.router
itself.
yugal.router
MUST BE RAN ONLY ONCE IN WHOLE PROJECT
Last updated
Was this helpful?