I have to use static hosting to create a website, how can avoid duplicating code without processors like blade or php.
I'm trying to use Firebase but I can't think of anyway to do this, I would normally use blade.
The only way I can thing of is using Dreamweaver templates but I really don't want to regress to that.
The way to go on this is to use a STATIC SITE GENERATOR, that will allow you to use partials(includes in PHP) there are a lot to choose from but a good recommendation is to use middleman here is the link to MiddleMan partials docs. good luck.
I use Yeoman with Yeogurt which uses Jade by default for templating but can use Nunchucks. You can use LESS or SASS/SCSS. Really good if you want to create a nice tidy static site. It takes JSON fixtures too so you can even create data for the site and compile it all down into static html, minified css and js, and compressed images.
Related
I want to generate a large number of static html. I like to use Gatsby because I enjoy writing JSX/TSX and generating the files using JavaScript.
But then every page includes the dehydrated GraphQL queries as well as an entire react for production runtime.
I know that that's what Gatsby does, but it is so flexible I imagine there must be a way to just generate the static html without the magic parts.
There's no official support for this by Gatsby.
Looking through their issues on github, there's one where this is discussed though (they have some fair reasons for not having support for it). At the end of the issue there's a comment linking to a gatsby plugin doing just what you want it seems. You might want to give it a try.
Github issue: https://github.com/gatsbyjs/gatsby/issues/11680
Gatsby plugin: https://www.npmjs.com/package/gatsby-plugin-no-javascript
I have a help system that is completely offline, no server, using file://.
I have one main page, with hundreds of line of html that represent many sections of the help system. I would like to stick each section in a html file and just include it. Unfortunately it seems like this is only possible with some nifty server side include techniques, with HTML5 (which I do not want to assume my users have), or with a nasty javascript hack where you copy your html file into js files with document.write calls for every line as written about here: Ways to include html in html.
What about something like handlebars.js or mustache.js? Can I use templating?
Since you don't want to use server-side includes, I would suggest using a static site generator (SSG).
If you are not familiar with SSG's, they allow you generate HTML pages from templates & includes (often Handlebars templates) and HTML, Markdown, JSON, or YAML, content using a CLI.
If you want to get started with an SSG, there are plenty of options, from Ruby based Jekyll, or Node.js based Assemble. In my opinion, Assemble is the best option and I would highly recommend it.
I use script type="text/template" for my project and I use a lot of templates, I want write my template in foreign file and include it to my html
If its possible , what type of file must i use and how must write it ?
In a pure JavaScript/HTML environment, you can't easily.
Your choices are:
Use some kind of JavaScript template library
I'm only familiar with Durandal that uses the Knockout engine.
AngularJS seems to be another popular choice.
Most of these packages include far more than just templates and may be overkill.
Use a server-side template package
PHP is a popular server-side tool.
Some HTTP Servers support Server Side Includes, but these are so limited I couldn't actually recommend them.
In my CakePHP app, I am defining a Wizard vendor that outputs the HTML for a multistep Wizard type plugin, along with its relevant Javascript code. I'm wanting to use the JsHelper so that I can buffer my code to the bottom of the page.
Everything else is working, including my Javascript code if I just output it directly with the HTML. I just can't quite figure out how to use the JsHelper. Do I use a App:Uses or App:Import statement? When using it in a View, I can just define it on the controller level, but that doesn't work here.
$this->Js->buffer("
$('.mws-wizard').wizard({
buttonContainerClass: 'mws-button-row',
orientation: '$orientation',
forwardOnly: $forwardOnly
});
");
If you are developing this 'vendor' package yourself, you should not develop it as a 'vendor', but as a plugin.
The vendor folders are meant for including third-party libraries that are not developed with CakePHP in mind (for example to use parts of the Zend Framework in your application).
From the manual:
Note: Loading vendors usually means you are loading packages that do not follow conventions. For most vendor packages using App::import() is recommended.
Create a plugin not a vendor
To develop re-usable code that can be used with different projects/applications, develop your code as a Plugin. Plugins are basically 'mini CakePHP applications'. Classes from a plugin can be used inside your application and vice-versa; a plugin can use CakePHP helpers the same way as you use them in your application.
See Creating Your Own Plugins
Regarding the JsHelper
Contrary to the comment placed by Sam Delaney, your usage of the JsHelper looks fine to me. Adding some script to the Js buffer to output it in the layout seems useful. Just don't try to use it for extended blocks of JavaScript; that should be put in external .js files.
I do recommend to write the JavaScript code yourself and not have the JsHelper generate the code for you (e.g. Don't use $this->Js->get('#foo')->event('click', $eventCode);). This may be personal, but IMO this makes it harder to track/debug your JavaScript and isn't any more readable than just $('#foo').click('event code');
I've personally never found any use for the JavaScript helper in CakePHP as if you're not careful, you end with getting <script> tags littering your markup, which sometimes makes it quite difficult to debug. From what you describe, you have the JavaScript aggregated and appended at the bottom of your HTML so it isn't as bad as the situation I highlight previously.
Is it not possible to relocate all your JavaScript to .js files to encapsulate all the function for your wizard plugin/vendor? If you could do this, it would be in keeping with MVC principles where you could logically separate the view markup and presentation logic.
I want to have achieve something similar to Java Tiles framework using only client side technologies (no server side includes).
I would like to have one page, eg layout.html which will contain layout definition. Content placeholder in that page would be empty #content div tag.
I would like to have different content injected on that page based on url. Something like layout.html?content=main or layout.html?content=edit will display page with content replaced with main.html or edit.html.
The goal is to avoid duplicating code, even for layout, and to compose pages without server-side templating.
What approach would you suggest?
EDIT: I don't need a full templating library, just a way to compose a pages, similar for what tiles do.
JavaScriptMVC has a view templating system that supports different engines, including a pure JavaScript based one called EJS.
You might also want to look into Mustache especially Mustache for JavaScript.
If you would like to use jQuery, there is a decent templating engine in development as well:
http://github.com/jquery/jquery-tmpl
http://api.jquery.com/jquery.tmpl/
Check this out:
http://layout.jquery-dev.net/
I thinks it's close to what you want.
I am looking at javascriptMVC at the same time.
In the forum they are talking about using jquery layout with it.
I don't know if it fit exactly to what you want to do, but using the GWT seems to be a good approach for rich client-side applications :
You write all your application in Java with the framework, and you compile for obtain HTML and JS files working stand-alone.