Going from webpage to website - html

I have been coding html/css for some time now, and I've gotten to be proficient at coding single webpages, but I can't figure out how to code a website. Some questions I have are:
Do I need to buy a domain if I want to build a website (for practice)
Are their special things I need to know (such as special tags) that I wouldn't have learned from coding just a single page?
Should I learn how to use a grid if I am coding multiple pages?

You may want to first decide what kind of back end you want (the server side code that builds and delivers the pages) I strongly recommend rails, and a react.rb.
You do not need a domain name.
A great way to start is to use a service like cloud9 which is free, and will get you going in no time. Cloud9 will do a one button setup of a rails environment and get you going.
Another approach is to begin using react.rb and just expand your skill set from the front end towards the server. The react.rb tutorial creates a simple chat application and you can do this all with the tools your already have. Once you have mastered that you can set up a simple rails server and start adding server side persistance (saving data on the server.) This is the approach I recommend, but full discloure: I am one of the leads on the react.rb project so I am very biased.

Well, you can build simple to wonderful STATIC websites from HTML/CSS but if you are talking about some serious web development then you will need to learn a server side scripting language. Most of the websites these days are database driven serverside webpages. There are many serverside programming languages and tutorials for the same out there.
I suggest you start with PHP (for scripting language) and MySql (for database)
Again, the choice of language is totally upto you.
Then you would need to learn about setting up a server on your local computer. For this you will need to learn about (x)-AMP. This would be WAMP, XAMP, MAMP depending on what OS you are using.
If you are only needing to develop a simple CMS website, then there are alot of CMS framework which you can go for, which will not require much of coding.

It seems as if you are looking to connect multiple pages to the same website, so you can navigate between pages. And it seems that you want to practice with local files. If that is the case, you need to first create a local folder for your website and use the a tag in your html files. Inside the a tag, you will need to include an href with the url to your other page. A link to another html page that is saved in the same folder as your original will look like this:
New Page
You will want to use external CSS and JavaScript files to keep all of your pages in the same format.
http://www.w3schools.com/html/html_links.asp
http://www.w3schools.com/tags/tag_link.asp

Related

How do I upload new posts with an admin panel to a Github-hosted webpage?

I have a webpage, actually a blog, posted with Github Pages. It's a simple HTML&CSS page. Normally, I create new files with my new posts in them and upload these files to my repository. However, I want to create an admin panel. Especially in order to post easily, and manage my blog (like adding tags, comments etc). I don't know where to start or what to use. I know how to program in C & C#, so it's not a problem if I have to learn a new language.
Any help would be appreciated.
You may be able to use a Headless CMS. These approaches normally are driven by git or some kind of API (you don't have to write any backend code) to add content to static sites such as yours. Although most of them work with markdown, so you may need some way to render the markdown into your HTML.
Headless CMS is normally used within Jamstack projects, so I'd suggest checking that out if that is something you're interested in.
I learned that I need server-side processing with languages like PHP or Phyton. However, Github Pages is a static site service and does not support dynamic web sites. So I will whether keep writing locally or consider another hosting services.

Best practise for updating / managing HTML pages

I am developing an e-commerce website as part of an assignment and am wondering what is the best practise for updating a collection of webpages.
I currently have one index.html page for the news etc. and then I copied and pasted the file and edited as i needed for the shopping cart functionality.
My question is; if I need to update something on the index.html file and which that change to show in all the pages, is there an easy / convenient way to update all of the pages together if I have a large amount instead of updating them manually one by one?
This is where the rubber meets the road for most developers. Now you are seeing a need to update something once and have that change propagate out to some / elements / pages. This is where making things "dynamic" and "modular" start to make sense and is the very reason server side scripting languages such as PHP were created. This in addition to a database such as mysql can create powerful, data driven websites and applications. HTML is just markup, all sites use it, but it by itself isn't able to take advantage of the benefits of being a dynamic language.
A great place to start looking for a content management system is by using something that has a lot of support / community behind it to help with the questions you will have along the way. It is also a good place to ease in to dynamic languages like php. I suggest using something like wordpress (wordpress.org) to get started. It handles most / all of the heavy lifting in regards to structure and all you really need to do is worry about the presentation of your site (themes). You'll only need something like MAMP (for mac) or XAMMP (for win) in order to make a local server (php / mysql) so you can install wordpress. There is a TON of resources and tutorials, plugins, themes, community support.
Edit :
Since you are limited to the client side. Alternatively, if you know javascript, you could look into a javascript MVC framework and use client side templates like handlebars, .EJS etc.
Good luck & Happy Coding!

Cross-platform lightweight master pages

Currently I have a web site full of static pages. This minimizes web server load and guarantees that this site will run even on tiny Linux-based hardware web server.
I am seeking for an ability to make master pages for my site and I like the way used by Ruby on Rails, but this technology is redundant for a simple web site and is too heavy for a simple hardware web server.
I like the SSI, it is really lightweight and cross-platform, but it does not provide master pages, it only makes includes that each document should maintain by oneself.
I like an AJAX technology, but it is client-side dependent.
The IFRAME technology does the opposite to what I want - it references from master page to slave page, and I need the reverse.
Is there something else left?
Template-Toolkit, specifically the wrapper directive, should do the trick.
You can use ttree at build time to generate static pages, avoiding the need for any server side technology beyond a simple HTTPD.
Em.. php includes?
So: CSS, Javascript, Includes directories detailing reusable styling, client scripting, and markup respectively?
There is no way to get any form of master page in the way that you are talking about without server side scripting I'm afraid. The best you can hope for is a JavaScript file that loads other JavaScript files, and external stylesheets (one unusual method I saw was the creation of a universal stylesheet that imported many others - but I didn't see all that much benefit to organisation myself). You could always use iframes... but iframes, as you point out aren't designed for that sort of functionality. That sort of functionality was within the scope of frames, and that had unpleasant results.
If you want to use something like php your server will naturally have to support php, but it is a simple way to produce easy organisation of your pages without having to dive neck deep into a complicated framework like Rails. In my experience adopting a CMS, particularly that developed by somebody else can be more trouble than it's worth.

How best to make a web app with multiple pages?

I'm trying to make a multiplatform offline webapp using PhoneGap. I know my html and css, but I'm not altogether familiar with the full capabilities of JavaScript, and I've never made a webapp before, let alone tried to use phonegap to empower it.
Right now, I have the main index.html that phonegap sets up for you, but now I'm uncertain as to how to proceed. If I want a button to take the user to another page from the main page, should I make a second html file and literally link between them, or is this a lot more complex than that?
Also (get ready for a possibly epically stupid question from a total beginner):
Do web apps have to be online? I'm really not clear on whether they function like normal websites in which they need to be hosted on a server, or if they can be packaged up and downloaded just like normal native apps. Please help!
Thanks.
Oh, and btw, I'm working in Xcode with the phonegap addon thing....I'm trying to get it running on the iphone before I move on to android.
Although the other answer helped me at the time, I thought I would add a more complete answer now, five years later, to my own first StackOverflow question.
To start with, a "web app" is the same as a "website" in a technical sense, and yes, they have to be hosted on a server in order to be accessed through the browser...just like every website. The only distinction is that a web app is generally a more dynamic and complex sort of website, involving JavaScript and AJAX. It would be misleading to call a simple website like this one a "web app," whereas Facebook is definitely a web app. Basically all web apps are websites, but not all websites are quite exactly web apps.
However, it only has to be "online" if you want it to be accessible anywhere from a browser via http. If you're making a Cordova app like I was at the time, that's not relevant. If you only want to run an application locally, you can do so with a local server like Python's SimpleHTTPServer or the one webpack provides, or any other alternative, including a server you write yourself from scratch.
As for the primary question about having multiple pages, yes anchor elements like my link are the standard way of connecting pages. To link among your own pages, you would have multiple .html files, and you would create a link with an href like href="myOtherPage.html", where that file is contained in the same directory as the file for the page linking to it. Alternatively you could set up a single-page-app where JavaScript loads new page content without the use of anchor elements-- in that case multiple .html files are not needed. Frameworks like Angular and React are helpful for accomplishing that, but it's by no means necessary.
In a typical web app, most of the time you would just need to create a link as you would if you were creating a link on a website. Also, Web apps can be developed via a local environment (research Mamp/ or Wamp) depending on the dependencies in which your app require.

Jump-starting web development

I wrote a prototype for my software in Python as a desktop client-server program, but I want to do the real version as a web service. (I have seen the light? much better deployment and reduced cost) Trouble is, I don't know web development.
I already did something webdev-ish: I have a page with a form on it, that when submitted Apache will run my Python script, which will do some server-side tasks and then send the result on a new page back to the user. Its a very simple tool (doesn't use any DB or framework), but I suppose that's the basic idea of web-based services... I think. To me that was a workaround, I did not realize it is webdev-ish.
So I have a basic idea of how it works, and about 8 years of programming behind me, but I need to learn:
How to design web sites (XHTML and CSS?)
Javascript and AJAX
More advanced features of databases (Postgresql)
I'm thinking Python/Django is a safe bet.
Any suggestions on where to start? I'm not the type who has the patience to read a book; I would rather jump in and build something simple first, then bigger and bigger stuff, but I can't seem to get my head around learning web design - I still format everything with tables.
Cheers and thanks
Check out Django. Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design.
There will be a learning curve, but you might as well learn how to do it right the first time. Go through the documentation, and start building small Django applications. There are tutorials on the Django website.
And yes, you will have to learn HTML and CSS anyway.
Tables are not evil, by the way. You don't have to learn your first website with CSS, but you will need to learn correct CSS layout sooner rather than later. There are free CSS templates out there you can use, which makes the correct use of CSS much easier.
I only got slightly into Django, but I hear good things, so stick with it if you like the approach... inheritance & templating language
XHTML blocks just need to not overlap (markup container rule, good XML syntax with contained elements closing before new ones are begun). Honestly the simplest & most common approach to start web layout is PHP, so I suggest that as first alternative since it is so template-centric.
my favorite CMS is ZOPE, built and used with Python for scripting. Zope3 is more like Django, Zope2 I use more still (Python 2.4.x) has some internal syntaxes and methods to grapple with at first, but if you wish to try it I have a basic site editing framework.
the advantage is the object database hierarchy is just like site structure, inheritance of scripts, content objects (HTML chunks & contextual values), properties... so duplication is minimized, the whole site can be a simple template, reuse & extension maximized. navigation scripted, archive by month & listing contents scripted, footer once, sidebar inherited throughout site - override by cloning into subdirs and editing or specifying object/property for local instance closest to the URL path then seeking up to root.
users can have roles in sections, XML-RPC/HTTP/FTP all ZOPE methods including user-defined, so rich clients can workflow media effectively. batch process media uploads with default containers for each item and metadata (filename, type extension) so users get right to their details. ZOPE can host files or static, remote, whichever, so long as the app knows where to find them (one base property for the app or project root)
if you get into Django there is the ZODB standalone library part of ZOPE for persistent storage only, no ORB