Where to start from in web development?

Question

Hi, I'm a college student in computer sciences and I love programming. I'm fluent in Java , C++ , vb.net and some python/c#. The thing is that I don't know much about web development. Only some HTML/CSS at a very low level. I'd like to know where to get started in order to end being able to build nice websites using some languages. What languages to learn first and up to which level in order to learn other stuff?

EDIT: Ok thank you everyone for your answers. Now, what tools do you recommend using in order to learn all this stuff. Should I host a server myself with everything I need installed or there's websites or tools made for easy development?

Related:

• Application developers wanting to start web development?
• Required reading for a soon-to-be web developer

Answer 1

You Should start with more advance HTML and CSS and then I would recommand to learn ASP.NET or PHP

Answer 2

I don't think you need to learn new languages. Just go and choose a framework (just like web2py) and you'll be able to do the server-side part in python. Focus on the UI, HTML CSS. The only language you should learn to do some good web application maybe is JavaScript...

Answer 3

The easiest to pick up quickly would be C# with ASP.net. Use webforms (just the page with code behind) to quickly learn it, then add on MVC.

This is the method normally used by code developers who do web programming; a web developer only would go for just HTML, CSS and Javascript.

Answer 4

Start by using Dreamweaver or Visual Studio Express

Answer 5

Since you're a student, you have plenty of time on your hand :-) My biased list would be:

1. Java HTTPServlet with Tomcat: learn the basics (since you're proficient with Java, that's an easy first step)
2. An MVC framework in Java or other language
3. GWT or other RIA framework
4. RubyOnRails or something totally different

I would personally not spend too much time on the "nice looking" part of the development. Engineers (at least in my case) are usually not that good at that and there are very talented web designers out there.

Answer 6

In order

1. HTML/XHTML
2. CSS
3. JavaScript (or a framework)
4. Server-side code of your choice

Update: Actually the best way to learn is probably by doing. Why not setup a personal website? Start with the basics and then move to playing around with navigation, a contact me form, etc.

Answer 7

My suggestion is to start with HTML, CSS, and Javascript.

Avoid WYSIWYG editors. My opinion is they hurt more than they help if you're not already familiar with web development.

After the UI basics (HTML, CSS, Javascript) I would suggest PHP.

Oh and have fun =)

Answer 8

I think you should start off by getting a good grasp of the basics such as HTML/XHTML and CSS.

Then move on to learning a server side technology such as asp.net with vb.net or C#. Since you have a good understanding of Java and C++ I would recommend using ASP.NET with C#.

This should enable you to produce good standards compliant dynamic websites.

Answer 9

Go to a website, one that looks simple. View the source in your browser. Start learning HTML on your own. Having a head start is key in college classes. Once you've figured it out enough to build your own page from scratch, it's all gravy.

Answer 10

I think you have to start with HTML CSS Javascript. these are fundamentals of web development and you will always need them.

After that you should choose a server-side programming platform. For .NET start with C#. Then you can learn ASP.NET very very quickly and effectively.

Answer 11

Couldn't have said it any better than Chris Pebble. As for a "Server-side code of your choice," I suggest using C# and ASP.Net web applications. The ASP.Net website has tons of create samples and tutorials as well as a great forum/user base that answers questions pretty well. The community is large enough that you can find good help with some simple google searching and you're doing it in a platform that is enterprise level. Mix it in with some SQL in ther form of SQL Server and you can learn a lot. Based on the experience you stated, it should be an easy enough transition.

Another avenue to explore is PHP/MySQL which is a good scripting based platform to learn with. While there is good user support, its not as friendly to setup the environment and start developing like ASP.Net which has a great IDE in Visual Studio which has intellisense, code-completion, the ability to build and debug easily as well as a WYSIWYG editor. However, I suggest using the HTML editor and editing your own HTML. So much more control and things come out the way you want it.

Answer 12

I agree with Chris Pebble in regards to what you should learn (HTML/XHTML, CSS, JavaScript, Server-side language). With your skill set I'd recommend ASP.net.

Personally I am a very visual learner, and having video tutorials along with code is very helpful. I took a bunch of online classes through the community college near me to learn html/css/javascript/SQL/PHP/Perl. If you have the time you may want to take a few classes through your community college (cheap and easy to keep motivated, but sometimes they are a bit slow). If you like an at-your-own-pace style, I would highly recommend lynda.com for a bunch of great video tutorials with code examples and project files.

Once you get a bit of experience, try buying a hosting account through a company like godaddy.com or other web host, and just tinker and try some fun web development tutorials you find around the internet.

After you get some basics down, you can try doing what I later did which was ask to volunteer at a non-profit organization and see if you can create/maintain a website for them. Most of the time they'll pay for the web hosting option, and give you a large ammount of creative freedom but major direction on what they would like (which is helpful). Also they will usually be pretty relaxed as far as schedules go (it took us 3 months to get a website published when I was working every Saturday for about 4 hours in the mornings). Also this will give you a very good idea of what kind of skills and features people really look for. Though it isn't much, here is the website I built for them.

If you really want to get completely into 'the web' and dont want to stop at just development, it wouldn't hurt to learn a bit about web design (the structure and 'look-and-feel').

Tools:

• Dreamweaver CS4 (for all basic development, including HTML/CSS, but probably not the tool you want to use with ASP)
• Visual Studio 2008 (for ASP development)
• Textpad -- great tool for basic text macros and such

If you are doing the whole web creation experience, then I would recommend taking a look at some Adobe products:

• Adobe Flash/Flex (Flex is Adobe's flash tool set for developers)
• Adobe Photoshop
• Adobe Illustrator
• ImageMagick -- command line tool to quickly convert, manipulate, and optimize images

I'm not sure about you but our school had a bunch of Adobe products available in the student store for prices way below even Adobe website's student pricing. I already had Visual Studio from a previous data structures class I had taken, but I bought the Adobe Design Premium CS4 software package that I hope to familiarize myself with over any breaks or the summer.

Answer 13

First off, I think Chris' answer is spot-on. These are the basics, and if you skip one or attempt them in a different order you're likely to end up very, very confused. You don't have to become a master in one before moving on to the next, just become familiar enough with how it works.

Javascript can seem like a daunting task at first. There are plenty of horrible examples and tutorials out there, many left over from the "Dark Ages" of the late 90s. Douglas Crocker and John Resig are the guys to study, IMO. A List Apart is another good resource. For frameworks I recommend YUI or jQuery -- both are solid.

Having done ColdFusion, ASP.NET and PHP development (in that order) over the last few years, I'd recommend the latter as a starting point. ColdFusion is fine -- it's how I started in '97 -- but I question its long-term viability. ASP.NET is great, but a beginner should not need to have to wade through a lot of the stuff that comes with it (event-driven paradigm, markup pages, code-behind pages, etc) simply to generate some dynamic content...at least, not at first. PHP is fairly straightforward and you can get a development environment up and running on Windows fairly quickly (see this presentation on WAMP from our local user group for assistance).

Answer 14

Ok thank you everyone for your answers. Now, what tools do you recommend using in order to learn all this stuff. Should I host a server myself with everything I need installed or there's websites or tools made for easy development?

Answer 15

I totally agree with Chris Pebble's list. However, I disagree with those recommending C# as a first server side language. While C# is an excellent language and .net is a powerful framework, all the "black boxes" in the .net framework can potentially greatly confuse someone who just learned html/css/js. .Net abstracts much away with its own conventions, which is handy for the professional, but a hindrance for someone who is still getting grounded in the fundamentals. Dragging an input field from a toolbar and styling it with a dialog box is quick and easy, but it doesn't give you practice dealing with the code.

That being said, I'd recommend starting with PHP. It's not as strong an overall language as C#, but there are some real advantages for a beginner:

1. You don't have to learn a framework to use it
2. You can start out writing procedural code and move to writing object oriented PHP as you get comfortable.
3. You have to do the work yourself. There is no framework writing HTML/JS/CSS for you. For a beginner, this is a great thing. After all, you learn by doing.
4. Web hosting is dirt cheap. Cheaper, on average, than most competing technologies.

For what it's worth, I code in PHP and C#.Net and prefer the .Net experience for a variety of reasons, but I believe you should learn to work without a framework first. The lessons you learn the hard way will do you a lot of good.

Answer 16

Start with HTML, then go to Javascript and CSS, then go to a server side language. There are many tutorials and books out there.

Between the JS/CSS and server side languages many people recommend AJAX/JS Libraries, thats is certainly helpful.

The server side languages that you might want to take a look at (the big 3):

1. ASP.net (my preference)
2. PHP
3. JSF/JSP

Answer 17

I assume you know HTML and CSS like the back of your hand? If not, learn them first. They are the components that actually interface with the user.

I'd recommend Django (python) as a framework, or even Rails. They are very simple and there aren't many "WTF's" when coding with them. I never bothered with PHP and it's never hurt me.

Answer 18

Start learning HTTP (may be skipped though, but do it at least before any server side language):

• HTTP tutorial
• HTTP specification

Then learn client side languages/techniques, in the order of HTML, CSS, Javascript and HTML DOM:

• HTML tutorial
• CSS tutorial
• JS tutorial
• HTML DOM tutorial

Once having good grasp on the basic concepts, I can recommend the following to improve your skills:

• Learn about DOCTYPE
• Learn semantic HTML
• Learn browser quirks
• Learn CSS best practices
• Learn about capabilities of CSS
• Learn Ajax (using JS to fire asynchronous HTTP requests in background)
• Learn jQuery (a JS framework which greatly eases Ajax and HTML DOM, has also several tutorials)
• Learn JSON (most widely used data format for ajaxical requests)
• Learn web design (convert photoshop image to HTML/CSS website)

If you prefer books above online tutorials, then I can recommend the "for Dummies" books, those are -in spite of a bit insulting title- generally very good.

• HTML for Dummies
• CSS Web Design for Dummies
• Building a Website for Dummies
• Javascript for Dummies

If you like jQuery, then I can recommend this book as well:

• jQuery in Action

That was it for the client side. For the server side I can mention several tutorials and links as well, but then you need to make a decision first which language to go ahead with: PHP (procedural hypertext processor), JSP (Java Server Pages note: this is NOT the same as Javascript!) or ASP (in combination with Microsoft C# / .NET).

Hope this helps.

Answer 19

Webmonkey helped me out quite a bit, and so did w3schools:

• http://www.webmonkey.com
• http://www.w3schools.com

Way back when I picked up some books by Lynda Weinman, who has since grown her business into an empire:

• http://www.lynda.com

And now I hook up with the O'Reilly for tips and articles:

• http://answers.oreilly.com

I learned a great deal about CSS layout and design from this site (which modifies a strict set of content with CSS. They also have a book.):

• http://csszengarden.com

I would highly recommend "Dynamic HTML: The Definitive Reference" by Danny Goodman and available from many booksellers. It's currently in it's 3rd edition, although I expect something new out soon what with HTML5 coming around.

Probably the best way is to dive in, and build yourself a website. Have fun!

Answer 20

First, you need a plan. A simple adhoc flow-with-the-wind plan.

1. Familiarising with HTML. Think of all sorts of HTML pages within your capability you wish to create and go forth and create their HTML/CSS by hand. Then use a tool like Microsoft's Visual Web Express to create more complex pages, mainly for the reason of inspecting the resultant HTML and CSS. Of course, why get it free when you can pay for it, then you could use Adobe's products.

2. Interactive HTML. Next, learn javascript and how to use it in your HTML pages. Learn using Javascript to validate html form input. Learn using css to change the style of display on-mouse-over, on-mouse-off, and animating elements on a page.

3. Raison d'etre/the great Revelation. The moment you get comfortable with HTML, CSS and Javascript working hand-in-hand, use your favourite programming language to generate the HTML of those pages. Don't think about a web server yet. I think you should choose to focus on one or two languages. This is the moment you feel like Darwin, Jesus, Mohammed or Buddha had - you get the revelation on the meaning of life. For you - the reason why web programming exist. The reason is - I want to generate an online airline reservation confirmation sheets - thousands/uncountable of them. Everything stays the same except the $customer, the $flightNumber, the $departure, $arrival, and the $ticketPrice.

4. Choose a religion. Choose the web application framework: Java/JEE, .NET, Python/CGI, PHP/CGI, Perl/CGI, C++/some-esoteric-HTTP engine. I am recommending you focus on Java/JEE and C#/.NET. All web application frameworks have to transmit/receive thro HTTP. There are lots of religious arguments on which is better. Religion is a personal decision with consequences to live with. The usual consequences of those choices are Tomcat, IIS, Apache httpserver as webapp servers for jee, .net and cgi respectively.

5. Choose your congregation. You need means to develop your applications. Eclipse or Netbeans? Visual Studio or SharpDevelop? or plain text editor. I am thinking that it is expedient career-wise to be proficient in both jee and C# aspx.net. For jee, you should start with netbeans before moving to using eclipse as development environment. For .net, you should start with the free visual express c# and web express before moving for full visual studio.

6. Generate a GIF/PNG dynamically. Give yourself this task - Write a web app that accepts a string, font angle, line rotation, theme as inputs and displays a gif/png, on the resultant web page, of the string in the style and angles as requested. You have to search for the library to do that. If you had chosen Java/JEE as your religion, your search for such a library would be effortless.

7. Generate a chart dynamically Next task - generate a web page that has a table and a line-chart on it. The table contains the total number of kisses per year (kisses from parents, aunts, uncles, cousins and siblings not counted) someone had between the ages 15 and 21. You have a file that stores the names of your friends, the year and total kisses each had per year. Your application first displays the choice of names on a combobox. When user selects and sends the name, your web app reads the file, generates the table and the line-chart and streams them back to the browser. Again if JEE had been your religion, the search for charting library would be effortless.

8. No refresh update Next, the modify the web app, so that the corresponding chart is generated and displayed without the web page being refreshed whenever the choice on the combobox is changed.

9. Mime-type/content-type. Create a web page that generates a spreadsheet or pdf to be displayed dynamically from server to browser. Now, you have to understand that http response generated by your web app need not be html but also various content-type. Hey, how about a web app that accepts alphabetic music notation and then generates a midi content-type of the tune to be played back to the browser?

10. XML and Web services. Next, using the number of kisses app, change it to request for stock price information from google finance gdata and tabulate and chart it. Your app would request for data on ten stocks every hour and store them on a database on your web server. Instead of friends' names, the combobox now has ticker of the ten stocks.

11. Server push. No, you don't need to have to click to get fresh data and chart update. You want the server to spontaneously update your selected stock price and chart by the minute. You now could decide using various means of pseudo server push: ajax using gwt, flash using openlaszlo, or silverlight. I think ajax thro gwt is the easiest choice, that is if your religion had been jee affiliated with the eclipse congregation.

12. Reincarnation, Purgatory, Heaven, Hell or Nirvana? While you are learning, you should just use the server on your home machine attached to eclipse, netbeans or visual studio. Which means only you and machines using within your local network could access your applications.

But now you wish to allow your application to be accessed by www. You have the following choices.

• Rent a shared server slot for $4.95/month. Most of these are cgi engines requiring you to write php or perl. There are few hosting providers that offer jee. These are hell because if you had five friends accessing any of your apps simultaneously, all apps come to a standstill because you are sharing a server with four other accounts. You cannot access their sql databases from your home development environment.
• rent server on demand like godaddy's - you have a monthly quota which takes care of usage spike.
• rent a $30/month shared virtual server - still has spike disadvantages but you now manage your own virtual machine which means you can access the sql database from home.
• rent a whole server for $300/month.
• rent amazon's web/cloud services. This is the best option.
• subscribe to google app engine (gae) and google apps. Free until you exceed some exceedingly generous quota. This is purgatory because gae places a lot of restrictions on your apps. You have to purge any library that uses jee sessions or thread expansion. Your religion must either be java or python. It is nirvana because the google cloud takes care of you. It is also nirvana because you have to forget about relational db but use google store, or use gdata to place/access data in gbase or google docs.
• use the server on your home/garage machine. Pay $100/month to your isp to let you have a commercial internet connection that comes with a fixed ip address.
• use the server on your home/garage machine. Subscribe to free dynamic dns service which updates your dns listing everytime your isp dhcp changes your ip address.