We Keep Coding

Dynamic web design, a newbie

Good day,
I am just at the "dawn" of web design and I haven't been able to find a good answer to
this question as of now.
"Let us say I would like to create a website that has 3 pages:
1) Index\Home
2) Contact
3) Personal Works
In the personal works section I would like a list to appear which is ok, I would just go
<ul><li></li></ul> etc etc
Now Let us pretend that in the <li></li> I want to put names of poems I have written as per my personal website portfolio. Each li would then send you to the requested poem.
All is good.
Now to the real question: I assume that creating 150+ html files for each single poem is a suicide, useless and dumb. That said, how do I actually do it?
I don't need you to do hard-coding for me. If you could just explain a little bit and maybe post a few tutorials\examples, Id be glad.
Love you.

That is where a server-side language is used. You use the server-side language to read some parameters and then provide the solution depending on the condition.
I would recommend you to use ASP.NET, or you can use PHP or some other server-side languages. But my preference is ASP.NET.
Solution:
You can try something like, one single page named: poem.cshtml (cshtml is a file, which accepts C# code alongwith HTML). Then inside the page you show the code depending on the URL. Lets say you're having a simple poem of Twinkle Twinkle Little Star. Then
http://www.example.com/poem/twinkle-twinkle-little-star
Now you can get the poem name using:
var poemName = UrlData[0];
Then use an if else block to do this:
if(poemName == "twinkle-twinkle-little-star") {
/* write that poem
* or by using else block, show other poems */
}
This is easy to understand and learn.
You can use Database to save the Poem and show it using ASP.NET. You need to learn alot.
Start Learning
http://basicsofwebdevelopment.wordpress.com (Beginner's Site)
http://developer.mozilla.org (To learn HTML, CSS)
http://www.asp.net (Official ASP.NET website)

What you need depends on how all that would be used. You may really need to use server-side language, or if content is generated on client side, respective array of li would be generated using javascript

For a newbie PHP would be the easiest server side language to learn, mixed with javascript, ASP.NET is also a nice language but a bit more of a learning curve although if you have any C# experience learning it would be easier.

How do I include ruby variables in javascript in Rails 4?

I have a rails application which is serving up a number of views which include specific data from the database to be manipulated by some javascript, specifically for use with Chartjs.
Options I have explored are:
Use an ajax call to pull the data off the server. I don't like this one because the user isn't changing any data, I have access to all the data when I render the page, there ought to be a better way.
Use <script> tags in the view ERB and simply have ERB interpolate the variable. This seems a little hacky and definitely doesn't take advantage of all my beautiful haml. But it is easy and allows me to put javascript variables on the page which can then be picked up after the document.onload.
Gon. Great gem and very easy. But should this really require a gem?
I feel as though the solution should involve the asset pipeline and some sort of rails interpolation, but I can't seem to make that work very cleanly. What is the elegant rails 4 way for solving this?
Thanks everyone!

There are many ways to pass data from server-side to javascript, I'll list two of the most common (that don't use a gem or other external tools) below:
Use the second method you described, and interpolate ERB tags inside the javsacript. This is ugly, hacky and is not even close to best practice.
Use data attributes. You can modify your HAML to include additional attributes, like "data-my-variable", and access it via javascript (example using jQuery: $(element).data("my-variable")).
The data attribute method is, in my opinion, the cleanest way of doing this, it's exactly the purpose of data attributes.
Now, I don't know HAML, I've only worked with ERB before, but I found this answer by Mandeep, which explains how you can add data attributes to your HAML:
%a{"data-my-variable" => "my data", href: "#"}
OR
%a{href: "#", :data => {:my_variable => "my data"}}
EDIT: Sorry, I found your question along with other, newer, questions, I just assumed it was recent, and not from over a year ago :)

symfony2 + javascript framework

My quick question is, should I begin using a javascript framework at the same time that I build my project with symfony or can I do it later without major troubles?
I have a small project of one page app written in flat PHP and jquery. Now I'm trying to port my project to symfony and I would like to use a javascript framework too. After one month of learning symfony I think that I begin to understand how it works, but I have a mess in my head with all those javascript frameworks available.
I think that is better to focus all my attention to symfony and once I fully understand how it works try to use a framework for javascript.
But I'm afraid of using a javascript framework implies changing a lot of my symfony code and twig templates. Right now, I'm using repositories and services to get data for the controller and then return it to javascript in JSON format. I understand that this shouldn't change (at least the part where I get the data) but I read some articles of people using bundles like FOSRestBundle and JMSSerializerBundle to return the data and using templates from javascript like mustache to render it, so I'm a little confused and I don't know if this will be a big change or if this is needed between symfony and javacript framework.
EDIT:
When I say javascript framework I'm talking about a combination of backbone + chaplin or marionette, for example. I think that jquery is just a library, not a framework, and backbone needs jquery to work.

All websites are completed by JS now, to be more user friendly and interactive, so yes of course you can use JQuery right now, from the beginning of your project because if you don't you will lose time by refactoring your actions to works with JS interactions and callback !
In addition, it will learn you how to manage JS in a Symfony project. You are free to use a vendor bundle or not to return JSON. You can simply do like that :
// action :
public function myAjaxAction()
{
// do something
return new Response(
json_encode(
array(
'success' => 0,
'error' => 'No image found.
)
));
}
And to finish, some documentation of Symfony2 use JQuery, like this : http://symfony.com/doc/current/cookbook/form/form_collections.html
So yes you can use JQuery now !

I'm not getting you. If you want to convert flat JS into JS framework in the future, why don't you use that from now on? From my experience, it's not easy work to convert your js(jquery way) into REAL Backbone way. Because you need to reconstruct all of your js code, even symfony code.
Though it's harder to use two new kind of technologies for you, I think you should try it.

Yes, you can use it very easily. Symfony is mostly for backend. You can put in Backbonejs or Angularjs for front-end stuff.

onclick in button with parameter value from textarea

I have a very simple scenario where I want to have a textbox where you can enter a number, and a button next to it which when pressed will call a javascript method and send it the integer value in the textbox as a parameter.
I am just learning MVC and have been very spoiled by WebForms so forgive me for the silly question, but why doesn't this work?
Enter Value 1-4<textarea id="param"></textarea>
<br />
<button id="btnTest" onclick="WCFJSONp(" + param.value + ")">Test Service</button>
I tried adding a # sign in front of 'param.value' hoping Razor might see what I'm trying to do, but that didn't work either? And can anyone recommend any links to 'crash courses' in Javascript/HTML for MVC newbs spoiled by WebForms?

As you state the question this has very little to do with MVC -- this is only javascript. Typically you would use jQuery with javascript when running the MVC platform, in which case something like this would work.
onclick="WCFJSONp($('#param').val());"
vs onclick="WCFJSONp(document.getElementById('param').value)"
When using getElementById you are not using the jQuery library but instead just base JavaScript.
There are advantages and disadvantages to using one over the other.
Using base JavaScript is faster, you don't have to load the jQuery library.
jQuery can make your scripts more portable (probably not an issue in this case), because it defines an exact interface to the DOM and takes care of any browser specific issues (this is the BIG one for me.)
jQuery is easier to use and understand. (some might argue if they are use to base javascript)
jQuery has lots of examples of advanced use (also not an issue here).
There are probably more but these are the ones that come right to mind.

This should be:
onclick="WCFJSONp(document.getElementById('param').value)"

Ajax integrating in Struts with jQuery

I am familier with jQuery,Ajax and JSP Servlets but new to Struts2.I want to know a complete reference of Ajax integration in Struts 2, preferred with jQuery. In stackoverflow also has more quesitons and answers, but still there are few things remaining to know.I need to know few things.
(1) Is there a complete reference how to use Ajax in Struts2 applications. struts2-jquery-plugin (and their showcase also) has many sample codes and demos. But I couldn't find how to handle it in Java classes.Their all samples found in itself are on client side- JSP samples only, no demo shows how the action classes work. No idea what the application returns(XML/JSON or what the server side returns) Their site demos only core functionalities. I want know how to how to handle both side; [in Struts framework] and [how to customize more struts ajax tags in JSP]. If there is any link or advice,it ll be highly appreciated.
(2)
I read Struts 2 In Action book. It has sample codes and demo.Its chapter 8 explains how to work with Ajax( used Actionsupport, another one extending Result class ... ). In Internet,few sample codes found, and they had used in some different way( directly PrintWriter print() the result). But in JSP side, normal javascript had been used. So, according to your best practises (may be more ways), what is your most preferred way to use Ajax? (that means,you use as jquery plugin shows or not depends on Struts ajax tags and just use javascript/jQuery in JSP pages, and the best practices to handle struts classes Write Result class or just use PrintWriter to print the result? Here you may say, it depends on the situation and the taste of the develoer, but what would be according to the industry standards?)
IF someone downvote. please leave a comment, WHY?

You should be using this jquery plugin instead; it is the closest thing the S2 project has to an official jQuery plugin. The one you link to isn't the same.
The most common way to return data to JavaScript (jQuery or not) is to use the JSON plugin or the REST plugin. There are very few reasons to ever write responses manually.