Easy way to "organize"/"render"/"generate" HTML? - html

I'm a relative newbie to web development. I know my HTML and CSS, and am getting involved with Ruby on Rails for some other projects, which has been daunting but very rewarding.
Basically I'm wondering if there's a language/backbone/program/solution to eliminate the copypasta trivialities of HTML, with some caveats. Currently my website is hosted on a school server and unfortunately can't use Rails. Being a newbie I also don't really know what other technologies are available to me (or even what those technologies might be). I'm essentially looking for a way to auto-insert all of my header/sidebar/footer/menu information, and when those need to be updated, the rest of the pages get updated. Right now, I have a sidebar that is a tree of all of the pages on my website. When I add a page, not only do I need to update the sidebar, I have to update it for every page in my domain. This is really inefficient and I'm wondering if there is a better way.
I imagine this is a pretty widespread problem, but searching Google turns up too many irrelevant links (design template websites, tutorials, etc.). I'd appreciate any help.
Oh, and I've heard of HAML as a way to render HTML; how would it be used in this situation?

Server Side Includes.
Old as time. Supported in most hosting situations. Often forgotten in favour of hugely overcomplicated templating systems. SSI still has a place.

You use a template language.
Most often this will be processed on the server, but there are offline solutions which you run though a utility to generate complete HTML documents for uploading.
I'm rather fond of Template-Toolkit which I usually use server side with Catalyst but it also very usable before you involve a web server using the ttree utility.

...........Wordpress?

I'd recommend Drupal. The tree structure of a menu is an inbuilt function and you basically can forget about it at all. And inserting whatever you want in specified areas (footer, header, whatever's defined in a template). It relies on PHP and MySQL - that stuff can be used on almost any server. And it has a moderate learning curve, so you should be able to start doing magic in little time.

Related

Identifying an Unknown Web Chart Component

I have come across a component in a few web applications; however, the html doesn't identify the component's name. Nor have I found it online. Anyone know what this component type is or where it comes from?
There are a number of frameworks that employ pre-packaged versions of the example image you have posted in your question, all the way from proprietary UI frameworks, such as DevExpress for the .Net Framework, to solutions implemented in a more open-source-friendly manner, i.e. you can see the code.
Without knowing the URL of the web application to which you are refering (e.g. .aspx, etc), it is difficult to know what framework the web app. is employing.
Menu
These menu types are generally called "radial menus" and a good Google would yield lots of great results. Sometimes knowing the terminology is all you need.
Some people have provided some very complex solutions to getting the type of behaviour you are looking for; however, in my opinion, re-inventing the wheel is a waste of time and money (it's great for hobbying around, though, certainly). The amount of time tooling around is perhaps better spent learning a little more about something else that will save you time in the future (and make your solutions re-implementable).
Diagram
Again, these guys are using stuff designed by people who are really passionate about web visual design. GitHub has a number of open source projects available for examination. For the record, I Googled: "circular word occurrence chart". Here is a directly relevant example from that repository mentioned, above.
The substance of my answer? A lot of these things you are seeing are employing more than just HTML and CSS to make their applications display information in such interesting ways.

XML content management

Hi there everyone this is my first time posting here, I am a student working for a really small company and I am in charge of developing the company's website.
Since I am only here for two more months, the boss wants to be able to change some content of the website without having to do any code.
He mentioned the idea of having an XML file he can update online, that will update the content of parts of the website. He does not want anything to do with third party websites.
So I was just wondering if this is even possible, I have no experience with XML, and really have no idea of where to start. All suggestions are welcome. Thanks in advance
Try a server-side include (SSI) with the something like the following tag:
<!--#include virtual="sitecontents/content_name_1.txt" -->
You can update the individual files (they don't necessarily have to include HTML tags) instead of trying to process an XML document. Much less development time and, frankly, much easier to maintain.
I did something similar to this for my website but used a database-driven concept. I have a secure area where I can enter in data via forms into the various database tables and then the information is automatically updated on the site via PHP. Takes awhile to get it all in place and working but has been worth the effort.
Now that I'm think about it, you can do this with XML as well. I played around with it a bit before developing the database-driven site. If you're not familiar with XML though it might be a stretch to get it done in the short time you have. You will also need to know XSLT which can be confusing at times. It is needed to connect to the XML file (data source) and then to parse the data and transform the information into something that looks good.

MySQL-based wiki that is suitable for custom applications?

I develop an online, Flash-based multiplayer game. It is a complex game, and requires a lot of documentation to fully explain it to our users. Ideally, I would like to find MySQL-based wiki software that can provide these editable documentation pages outside of Flash (in the HTML realm) but also within Flash for convenience, and so that players can refer to the information without interrupting their game or having to switch back-and-forth between browser tabs. I am expecting that I would need to do a lot of the work on the Flash side myself, as far as formatting, for example, but I would like to feel comfortable in querying the wiki's database to get info directly. I guess this means that I need a wiki that is structured relatively "flat" or intuitively so that I can do things like:
Run a MySQL query that returns a list of all the articles (their titles and IDs) in the wiki
For each article ID in the wiki, return the associated content
This may mean that I have to limit the kinds of formatting I put into the wiki -- things like tables would probably be omitted since they would be very difficult, if not impossible, for me to do on the Flash side. And that is fine!
Basically I am just looking for suggestions for wiki software that is pretty easy to use, but mostly is technically simple enough on the back-end that interfacing with it directly via MySQL is not difficult. When interfacing with the database directly, I only need to READ data. Any time the wiki would be edited or added to would be done via the wiki's actual front-end application.
Thanks for any suggestions!
MediaWiki is the best-known and best-supported MySQL-based Wiki, used for plenty of complex game documentation projects like MinecraftWiki. The database is not all that simple, but it's well documented and basic read operations aren't too hard. For example, here's how to fetch the current content of the page "MyPage":
SELECT old_text FROM page,revision,text WHERE page.page_title="MyPage" AND
page.page_id=revision.rev_page AND revision.rev_text_id=text.old_id;
(And yes, old_text is the current content of the page. Don't ask me why!)
Your main problem will be figuring out how to parse MediaWiki markup, there are plenty of parsers for it but I'm not aware of anything that would work in Flash.

web site development best practices, design or code by first?

I'm using an MVC framework to develop a web site, I've to care about the design in the sense of look and feel (views) and the code (models, controllers).
I don't know what is the best way to proceed:
code and design iteratively by small chunks?
design first ?
you've got the point
I suggest you design first - it can be a rough design with a pencil/paper but it will give you an idea of what information should go on the page in what manner. This will help you with your views and controller logic. Dont' worry too much about colours at this point.
I always feel it is better to do things iteratively. Design a page or two, construct the model and controller relative to that page, and repeat for other pages.
Sometimes if you spend too long in your models and controllers and neglect your views, you'll end up doing way more or way less than what you need.
The 37 Signals (the source or Ruby on Rails and some really cool web apps) book Getting Real advocates working from the interface down. It gives you a better sense of how the site will be used before you do too much back end implementation.
Here is the specific chapter: From ideas to implementation.
PS: Read the whole book, it's brief and a really good overall philosophy for building things the way they should be build. And no I am not affiliated with them in any way.
One small, but very good tip I got, was to work out what kind of 'friendly' URL's you would like to see in your site. This in turn leads you to what routes your require, which in turn gives you an idea of the controllers and actions you will have to create.
It depends but there are several rules of thumb:
the bigger the project the more it benefits from the design first, design well approach.
if there's inter-dependence between the elements of the project - such as lots of foreign keys in the database - you are better off at the very least designing everything around those inter-dependencies, or you're gonna regret it later
MVC frameworks enforce some design decisions by their very nature, so use that to help you
beyond a certain size - say more than a week's work - it's an absolute necessity. Same goes if it's a team effort
In your particular case, since I'm not sure about the project size, I'd suggest having your schema designed ahead based on your needs, which will tell you about dependencies, and then do the iterative thing, starting with the dependencies.
If you have specific APIs you have in mind, it's a good idea to design around those as well
The beauty of MVC frameworks is it simply does not matter.
Obviously you'll need some vision to work to, but it's up to yourself. I'm a strong believer in iterative development. In this case you'd create a section of the site, views, models and so forth. Once that was working, move to the next section/feature of the site.
The both ways are OK but it would be better if you have a designed view (even a mock up) so you can know what data to get how to format it when you develop you model and controllers
My suggestion which will save you a lot of time and headache is start off with design.
You have two designs here. One is the UI (interface) design. All the visuals etc.
When you have a UI design you will know how to create your mark-up from the get go without having to do the work twice after you've completed a design.
The other is the software design. the MVC framework helps a lot with this but you also don't want to just start coding without having a plan. You'll find yourself back tracking a lot and recoding stuff you've already done that way.
An iterative approach is the way to go. I might suggest spending time on the model and getting it solidified first. Then, iterate through your controllers and views. This will help validate what you've done in the model, and bring up any glaring issues that need to be addressed sooner vs. later.
I, as most here would say design (at least to a extent) first.
I would wireframe interactions (these can, and should be be refined later) and, perhaps most important, (at least if it's a traditional web site you're working on) plan the architecture, map the structure of the site you're working on (the Information Architecture part). In order to get an overview of the site and know map out user paths through the content.
That's at least my 'modus operandi' for web sites if I'm working alone on them.
(I mostly work in a UX team so my professional workflow is more in the design part than production coding nowadays)
Understanding the Requirements
Database Design
User Interface Design
Business Logic Design
From my experience I would say you should always plan first. (I even plan my planning phase).
I assume you’re doing something like a GUI wired up via .aspx using the MVC model, maybe even the Entity Framework?
Web development like this can very easily get complicated once you start to build it up.
It is important that before you do anything you know exactly what it is that you are trying to do, this way you know when you are undershooting or overshooting your goals and whether or not the code you are writing actually fulfils the requirements.
There are many models which you can base your project development on, all of which loosely follow a sensible System Development Life Cycle in one way or another.
If you haven’t read up on the different development methodologies, here’s a site that will give you a good overview : http://www.itinfo.am/eng/software-development-methodologies/

A beginner's question on web technologies [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I am just dipping my hands into web technologies. I started with HTML and now JavaScript and PHP. I have a variety of questions in my mind. I am a hardcore .NET Windows developer and earn my living with it. But now I want to go deep into Web and so here are my queries:
(1) I started using PHP. I also want to learn Ruby with Rails. Can I learn both side-by-side?
(2) What type of sample projects I can develop to learn well these technologies? I just have in mind to make a web log, that it.
(3) I am using Aptana Studio 2009. It is very good but not the best IDE. Which other IDE can speed up my design time? Any tool that separates the design with business logic automatically?
(4) What other things I must learn to bring myself to the front in web technologies?
Firstly, I applaud the initiative in learning Web technologies. Frankly, going forward, I think programmers will increasingly find it harder to not know Web stuff.
To answer your questions:
I would advise sticking to one at least for awhile. I'd suggest that one be PHP. Why? Ruby on Rails is a language and a framework. I'm a strong advocate of people having some understanding of the underlying technologies, including HTTP, before they throw frameworks on top of it that may confuse or hide issues a developer needs to know about. Stick with vanilla PHP and don't confuse it by throwing something like CodeIgniter, Kohana, Symfony, CakePHP or Zend on top of it;
A blog is a fine learner project. Whatever you pick shouldn't be something terribly complicated, something you can get something out of relatively quickly and something you should be able to add features you want to (you'll be more interested this way);
Jetbrains new Web IDE is coming along nicely. It's what I've switched to. PhpEd, Eclipse PDT and Netbeans all have different merits;
HTMl, CSS and Javascript. Additionally I'd also recommend jQuery.
1) Yes. But it is advisable to pick one technology/web framework and master it. It is easy to get caught in the technology rat race.
2) Think of a problem you have been facing say at workplace. Perhaps there is some routine work that can be done better using a web application. Use that as a project.
4) Read up on basic design principles like layout, color etc. The Non-Designer's design book is a good place to start.
1). I personally would advise you go with Ruby, Java or .NET but stick to one whilst learning, preferably the one closest to he language you know already, which for you means .NET (C#?). I wouldn't recommend PHP under any circumstances but plenty would.
2). Yes, a blog is a good starter project.
3). Just get yourself a good text editor for starters. IDEs make a hash of HTML/CSS/JS which is what you'll be doing a lot of too. But you can stay on the free side by getting a copy of Visual Web Developer Express Edition.
4). Get seriously aware of HTTP, HTML, CSS + JS. In fact don't even think about dynamic pages until you have static pages down solid. Then add dynamic functionality.
Addendum:
From my experience of colleagues who have taken the path you're taking, desktop development teaches you a number of bad habits for web development that you're going to need to unlearn. Specifically: assumptions about state, client vs server, concurrency, and - both most and least serious - inline styling. Bad. Bad. Bad.
A solid understanding of HTTP helps clear some of those, and learning CSS (as an effective way of learning the value of separation of concerns) helps with the latter. Concurrency is something most frameworks will take you 90% of the way with but it's always going to be up to you to think about when and how to apply it.
Given further thought I would ultimately recommend you stay in .NET land (the ASP.NET pipeline model and C# as a whole are solid and mind-blowing respectively) and get yourself express and download ASP.NET MVC extensions for it - the WebForms model is pretty widely reviled by web developers for a reason, but coming from a desktop background it might be more immediate for you. At the expense of settling you into those bad habits I mentioned.
Yes if you're dedicated. If your php is stronger than your RoR familiarity there's a book for you # http://railsforphp.com/ - I would recommend getting more familiar with PHP then jumping to RoR as it's a bit more to learn because of the whole MVC architecture and the language itself is different from most semicolon and braces C-style languages.
The hello world of web programming - a blog.
Personally I use VIM which isn't an IDE, but it's pretty friggin efficient for text editing.
I would recommend often reading Stackoverflow and try to answer some questions while you're learning some new technology, it'll double the rate at which you'll learn if you really force yourself.
You can. I think I would advise
against it.
Blogs are good
places to start. Maybe a photo
gallery?
Eclipse is nice for all
sorts of development.
Like Nike
says, "Just do it" :)
1) This depends on your learning capability, but you really shouldn't. Start with either one, get good at it, then the second one will be much easier to learn.
2) As said before, blogs are a great way to start. You also want to create something like a shopping system to get the grip on good database development.
3) You don't want to create Business Logic alongside the UI. Try learning about templating engines such as Smarty, and your problem will likely vanish instantly. Try Eclipse for an IDE, or better, learn about vim.
4) Discipline. It is incredibly easy to shoot yourself in the foot using PHP and Ruby using crappy code. Dot your is and remember to initialize your variables. Don't just copy code from somewhere, but think of what it does and what could go wrong. Sanitize user input. This takes work, but saves headaches later on.
1) Dont you will just confuse yourself. Learn one after the other both are good!
2) Amazon and Wikipedia are largly php based, I know of a couple of airline booking systems, most blogs are based on one of several freely available php applications.
3) For php/javascript/css I have always gotten by quite happily with good old vim, but thats just me. I would beware of any "framemaker" type GUI html editors as they tend to generate a lot of confusing and unreadable html. Its alright for a static page but when you generate a dynamic page you really need to know what all the html tags are there for.
4) If your serious you really need to learn about cascading style sheets and how to use them properly.
(1) It is all about what you want to do and are you OK with handling new technologies. You can do anything.
(2) What about hello world or simple login application if you are beginner really.
(3) Eclipse always a Best option to think.
(4) CSS, JavaScript, and new JavaScript frame work like prototype,jQuery and more importantly some of the tag library.