I need a static site-generator with the following characteristics:
simple: I don't want to be obliged to learn a new language to create a site (unless it is html, css, markdown, etc.);
open: it has to be free (as in freedom), or open-source;
themed: I need something aesthetically acceptable.
The site has to be hosted on gitlab.
Can you give me a hint?
You might check Eleventy, which allows considerable freedom in templating including, yes, HTML and Markdown, although you obviously won't have all the flexibility you'd get from using a programming language.
Related
I've been struggling to understand Handlebars ever since I was introduced to it in class. I've researched different resources and videos (e.g., YouTube, StackOverflow, etc.) to try and learn more about it, but I still feel like I'm not getting it.
Could somebody please either explain to me what Handlebars is in their own terms or send me resources they found helpful when learning it?
Thanks!
handlebars.js is a templating engine which allows dynamic data to be mixed in with your HTML code. Templating engines were created due to complex projects requiring a lot of dynamic HTML manipulation. Previously, software developers created new chunks of HTML code and dynamically inserted them into the DOM using Javascript. This eventually became unwieldy and difficult to maintain. Also, it lead to repetition of code. To solve this issue, templating engines allowed one to create predefined templates to be used in multiple locations without repeating the code. Templates are like “macros”; wherever they are used, the code in them is inserted at that place. They also help to keep your html away from your javascript files, thereby increasing the readability and re-usability of your code. For a more comprehensive explanation see this blog post
The best resource to learn handlebars.js is their documentation
There is a course on Udemy that uses handlebarsjs and Node and Express and goes from pretty basic I think. This is it.
I'm creating a website where I'd like the client to be able to add articles, images, and audio clips without having to edit the code of the website.
For example; on the sidebar of the site, there's 3 audio clips (they're demos of music) with images and text to go along with them. I'd like for them to be able to change all of those things at any time.
Any language that is server-side can be used. This includes, but is not limited to, Python, Ruby, and PHP. This question is otherwise too broad to give a definitive answer.
You should use a CMS (content management system) like Drupal. Your client will have access to a nice web interface to manage the site content.
You can use any server side Language like,PHP,JSP/Servlet,ASP.NET etc.
PHP will be easier for implementation.
It sounds like you want standard html and javascript.
Bootstrap would help aid the design process and jQuery would aid the coding.
I find myself doing a lot of work here and there (both for myself and on contract) to develop small, static websites where the use of dynamic tools like PHP frameworks or Rails would be totally useless and heavy-handed and a waste of resources.
I'm looking for a way to author static HTML sites that introduces a level of modularity and syntax simplification; to clarify, something like SASS for HTML with a fast syntax and that allows common patterns to be extruded out in to separate files.
I'm aware of HAML. I would love for HAML to be my solution. But in all of my reading, HAML doesn't seem to have an equivalent to a SASS-style include directive used for in-lining the content of external files. In addition, HAML seems to bill itself as more of a templating engine than an authoring tool the way SASS bills itself; it seems to have a desire to be a replacement for ERB and to be used in Rails projects, rather than being used as a modular HTML preprocessor.
I know I could roll my own solution by bolting a small amount of Ruby and in-line evaluation on to HAML, but it feels a little cheap and dirty since this isn't really what HAML "wants" to do. It's not a solution I'm averse to, but if there is a no-configuration, light-weight option out there that basically behaves like SASS but for HTML then I'd prefer to go that route.
We build static sites with middleman. There are a lot of features, but mainly it's just a very handy static site generator (for development and production). As a plus middleman is a quite popular thing.
And another known option is a Serve. It may be useful for rails prototypes or for those people, who already familiar with rails.
But I still prefer middleman because it's more popular (Serve just more younger, not worse).
As about your question: in both tools you can split HAML views into partials, layouts, etc.
Also, take a look at this category.
It sounds like Stasis would fit your needs very well. I've used it to build a number of small static sites now.
Another option is Jekyll. It offers an easy setup, easy syntax, plugins and extras.
I have a site that wraps some user-generated content, and I want to be able to separate the markup for the layout, and the markup from the user-generated content, so the u-g content can't break the site layout.
The user-generated content is trusted, as it is coming from a known group of users on my network, but nonetheless only a small subset of html tags are allowed (p, ul/ol/li, em, strong, and a couple more). However, the user-generated content is not guaranteed to be well-formed, and we have had some instances of malformed user-generated content breaking the layout of the site.
We are working with our users to keep the content well-formed, but in the meantime I am trying to find a good way to separate the content from the layout. I have been looking into namespaces, but have been unable to find good documentation about CSS support for embedded namespaces.
Anyone have any good ideas?
EDIT
I have seen some really good suggestions here, but I should probably clarify that I have absolutely no control over the input mechanism that the users use. They are entering content into one system, and my page uses that system's API to pull content out of it. That system is using TinyMCE, but like I said, we are still getting some malformed content.
Why not use markdown
If your users are HTML literate or people that can grasp the concept of markdown syntax I suggest you rather go with that. Stackoverflow works great with it. I can't imagine having a usual rich editor on Stackoverflow. Markdown editors are much simpler and faster to use and provide enough formatting capabilities for most situations. If you need some special additional features you can always add those in but for starters oute of the box capabilities will suffice.
Real-time view for self validation
But don't forget to include a real time view of what users are writing. Self validation makes miracles so they correct their own mistakes before posting data.
Instead of parsing the result or forcing the user to use a structured format, just display the content within an iframe:
<iframe id="user_html"></iframe>
<script>
document.getElementById("user_html").src = "data:text/html;charset=utf-8," + escape(content);
</script>
I built custom CMS systems exclusively for several years and always had great luck with a combination of a quality WYSIWYG, strong front-end validation, and relentless back-end validation.
I always gravitate toward CKEditor because it's the only front-end editor that can deal with Microsoft Word output on the front end...that's a must-have in my books. Sure, others have a paste from word solution, but good luck getting users to use it. I've actually had a client overload a db insert thanks to Microsoft Word that didn't get scrubbed in Tiny. HTML tidy is a great solution to clean things up prior to validation on the back end.
CK has built-in templates and classes, so I used those to help my users format without going overboard. On the back-end I checked to ensure they hadn't tried any funny business with CSS, but it was never a concern with that group of users. Give them enough (safe) features and they'll never HAVE to go rogue.
Maybe overkill, but HTML
Tidy
could help if you can use it.
Use a WYSIWYG like
TinyMCE
or CKEditor that has built in cleanup methods.
Robert Koritnik's suggestion to use markdown seems brilliant, especially considering that you only allow a few harmless formatting tags.
I don't think there's anything you can do with CSS to stop layouts from breaking due to open HTML tags, so I would probably forget that idea.
Well, I know a little HTML, and I'm just interested in playing around with it. I was wondering, though, do people usually write websites from scratch, or do they use templates, or do they use WYSIWYG editors?
To me, it seems like writing from scratch is unnecessary, nowadays, with the editors and templates we have, but maybe I'd be better off to try write something from scratch from learning purposes?
So, if I want to learn HTML better than I do, what is the best way to go about it (I have access to a free server) and how do professional website creators do it? Maybe this is an obvious answer but I'm quite new to it. Thanks!
If from scratch means hand-writing the markup, yes, that's the correct way to do it.
WYSIWYG, fully-bloated editors, are not good alternatives if you are serious about writing a web-site -- as most drag-and-drop-and-run systems out there. They might serve their purposes, but they are not general professional solution.
Hand-written markup (HTML, XHTML) and CSS will always provide better cross-browser compatibility, will be much more optimized and easier to maintain.
I really like Aptana Studio. It is an IDE that enables you to easily write the markup (HTML, XHTML), the formatting (CSS), the client-side code (ie, animations, etc, through JavaScript, and it is really well integrated with common JavaScript frameworks) as well as server-side code in a very professional way (PHP, Ruby, and many others). Oh, and it's free.
Aptana is better than, say, Notepad clones, because it is adapted to Web Development: all the time you have context menus popping up containing hints about compatibility, it displays errors on the markup, etc. It understands your code better than most notepad clones do.
I definitely recommend writing from scratch when you are learning. Using a wysiwyg editor can create a lot of extra code that you have no idea how to deal with when something strange happens and you have to edit the HTML itself. Using something like Notepad++ that supports code highlighting can help a lot.
the secret of html is: not writing it. means: keep it as tiny and semantically as possible and thats where all WYSIWYG editors fail. they let you create 403 nested dom elements whit 2 mouseclicks and if you are a beginner you don't even realize how wrong that is.
I agree with others that learning HTML makes sense. But at the same time, you can use WYSIWYG as a learning tool if necessary. I know that when I first started creating websites, margins and padding always seemed hard to properly format (due in part to inconsistencies across various browsers), and using a visual editor did help me figure out how changing certain values affected the view.
My favorite WYSIWYG editor is probably Nvu just because it is free and less bloated than software like Frontpage. But as others have noted, just practice with HTML. Check out w3schools for a nice intro and reference pieces.
Depends on the budget and software adquisition posibilities (yes, the budget).
Assuming you are talking about research, design, development, scripts, flash and everything you need the best option is Adobe Creative Suite for Web Designers.
There´s no powerfull editor in the world than Dreamweaver and that´s a fact.
You should use Notepad, Notepad++, jEdit and whatever you want but if you want to be productive a serious IDE is the best choice and Adobe win by far.
My opinion!