Jump to content


Starting a website project

Started By n5p29, Oct 31 2011 13:07

16 replies to this topic

#1 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 31 October 2011 - 13:07

This semester I got a college project of making a website that have css styles, javascripts, web application with servlet (what is this?), JSP, database, and something like that.

The problem is the class is using Microsoft Expression Web for work, but in other hand I only have Microsoft Visual Web Developer Express installed in my computer. Should I get the Expression Web, or just use the Visual Web Developer? is there any difference between them? which is better?

On the other side, I'm thinking of making this project include my mods (because I think it might be useful in the future). Is it possible to get this idea alongside the requirements above? I'm pretty clueless about those things (especially the few lasts). and if not possible I need to look for another idea.

I'll be grateful for your help.

Edited by n5p29, 31 October 2011 - 13:29.

Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#2 Dutchygamer

    Shyborg Commander

  • Member Test
  • 1899 posts
  • Projects: Frontline Chaos creator and leader, Invasion Confirmed co-leader

Posted 31 October 2011 - 17:43

Coincidently, I also have to make some kind of website/blog/portfolio, and I made sure I included a section with mods :) It shows you can be dedicated to something (if you're working solo), can work in a group (if member of a group), or have leadership skills (if mod leader and have members). At least, this is what I assumed. I include it for the heck of it, and because it's a rather boring site without it :xD:
Posted Image

#3 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 31 October 2011 - 21:28

Unfortunately I haven't done any Java before. But I can help you and HTML/CSS/javascript questions you may have.

As for which piece of software to use, of the two I've only ever used Microsoft Visual Web Developer Express, but by the looks of it, Expression Web maybe a little bit more user friendly (from a beginners point of view), but tbh, all you really need is a text editor (preferably I light weight one) and some software to compile the project (which I assume Java requires?).

Making a website for your mods is probably a good idea. You will be a lot more enthusiastic about the project, if it is actually something that you may end up using. :)
Posted Image
F O R T H E N S
Posted Image

#4 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 01 November 2011 - 15:16

thanks. btw, how if I want the website have some fancy animation like.. this forum for example.. when you click the login button there's a popup fade in?
is that using javascript, java, or what?
Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#5 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 03 November 2011 - 00:04

You would use javascript. I would recommend using a javascript library, more specifically, jQuery.

Here is an example of a cyan box fading in on a red background. You should be able to just copy the code into a blank HTML and play around with it.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <style type="text/css">
   body{
	background: #ff0000;
   }
  
   #mydiv{
	width: 200px;
	height: 200px;
	background: #00ffff;
	display: none;
   }
  </style>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
  <script type="text/javascript">
   $(document).ready(function(){
	$('#mydiv').fadeIn(1000);
   });
  </script>
</head>
<body>
  <div id="mydiv"></div>
</body>
</html>


The first script tag loads the javascript library, in this case I am loading it directly from google, but you can download the library from the jQuery site.

The second tag is where there 'magic' happens.

For more general website top and tricks, I would recommend looking through the tutorials and references on w3schools. w3schools also has a section on jQuery, but I would also recommend using the jQuery site as a reference for the various functions.

Edited by Bob, 03 November 2011 - 00:07.

Posted Image
F O R T H E N S
Posted Image

#6 Alias

    Member Title Goes Here

  • Member
  • 11705 posts

Posted 03 November 2011 - 02:40

Technically he could use CSS3, which would be easier to pick up.

Posted Image

#7 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 03 November 2011 - 09:25

And also wouldn't be cross-browser compatible...

Besides, if it were to be a popup, it would be most likely triggered onclick, rather than on page load, which isn't really possible with css3 alone.

Edited by Bob, 03 November 2011 - 09:26.

Posted Image
F O R T H E N S
Posted Image

#8 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 03 November 2011 - 10:43

that's a neat website. O:
thanks for the link. those tutes are really useful (as the college class not explaining much about the coding >.>).

as for jQuery thing, will it work on offline pages? because the lecturer didn't said anything about host the project on the net.
Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#9 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 03 November 2011 - 11:27

Yes it will work on an offline page. You can download jquery from the jquery site, and instead of referencing the google jquery file, you reference your own.

For example, if you have a folder structure like the following:

index.html
scripts/jquery.min.js


You would then reference the library with the following (instead of the google one):

<script type="text/javascript" src="scripts/jquery.min.js"></script>

Edited by Bob, 03 November 2011 - 11:28.

Posted Image
F O R T H E N S
Posted Image

#10 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 08 November 2011 - 14:34

okay, after asking the lecturer again about the project requirements, it doesn't really need to have all those things on the first post. the important ones are working interface, javascript usage, and access to database (JSP or PHP).
for the first two things is easy to be done for my website theme, but I'm not sure about the last one. what a mod/portofolio website have to do with database? does something like accessing image gallery or retrieving information separate wiki page (like FSDB) count?

Edited by n5p29, 08 November 2011 - 14:35.

Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#11 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 08 November 2011 - 16:59

You would store information in a database. For example, if you wanted to have an image gallery, you could save the title and description (along with the filename) of an image in the database. I doubt accessing an external website would count towards accessing a database, but that would be something you would need to clarify with your lecturer.

As for JSP vs. PHP, as I have already said, I don't have any experience with Java, so I can't really compare. But I found PHP pretty easy to learn, and even though I have learned many new languages since I first learnt PHP, it's still my favourite.

Connecting to a (mysql) database with PHP is nice and easy:

mysql_connect('SERVER', 'USERNAME', 'PASSWORD');
mysql_select_db('DATABASE_NAME');


Then to retrieve information you would need to do something like the following:

$result = mysql_query("SELECT * FROM table_name");
while($row = mysql_fetch_array($result)){
	echo $row['column_name'];
}

Posted Image
F O R T H E N S
Posted Image

#12 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 09 November 2011 - 16:48

ah yes, he said image gallery can counts as accessing database.
does PHP can be compiled without additional things unlike JSP? I also found JSP annoying because the language kinda unsupported in VWD.
Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#13 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 10 November 2011 - 23:03

PHP doesn't need to be compiled. Probably one of the reasons I still like PHP so much. :P
Posted Image
F O R T H E N S
Posted Image

#14 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 09 December 2011 - 09:11

sigh. they forced me to use JSP. now I must find how to run it on local host. why they don't use PHP or ASP instead? >.>

anyway I'm having difficulties designing the website layout. I can make simple web layout like this, but when it got more fancy skin like this, I can't positioning the pics correctly.

and how to remove the blue border when there's a picture with hyperlink?
<a href="http://website.address.here.com"><img src="imagelinkhere.jpg" /></a>

in the browser the picture having a blue border around it like how a hyperlink having an underline. how to remove this?

Edited by n5p29, 09 December 2011 - 09:14.

Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#15 Slightly Wonky Robob

    Not a Wonky Gent.

  • Administrator
  • 9337 posts

Posted 09 December 2011 - 21:23

To remove the border you need to add the following to your stylesheet.
img{
	border: 0px none;
}


As for your layout issues, if you give me an idea of exactly what you want to achieve, I can point you in the right direction.

If you want to look at how other people have achieved things on websites, I suggest you have a look at the code. :) If you are using FireFox, you can download Firebug. Opera, Chrome, Safari and IE9 all come with there own versions built in. You can right click on an element, on a website and select 'inspect element' this will show you where it appears in the DOM tree, and all the styles / attributes it has.

Edited by Bob, 09 December 2011 - 21:53.

Posted Image
F O R T H E N S
Posted Image

#16 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 10 December 2011 - 09:15

okay, let's use that GenX website as example. even I've checked the source code, I still don't understand several things:
- the navigation menu using ul and li tags, but it appears sideway instead an unordered list
- I see it uses background pictures to construct the website skin. for example this and this composed the navigation bar. but when I put something as table cell background it will be cut if the cell have no text in it. any way to prevent this without using fixed cell height?
- I also see it doesn't use a table to separate the elements but using div instead. what's the pro-cons using div instead a table?

I also having problem when using pictures with transparent background for my website. if I saved the pic in gif format the transparent parts always messed up, but if I use png the transparent part didn't work and turned white instead.
Posted Image
NProject Mod -- Recolonize -- Tidal Wars

#17 n5p29

    Lurker

  • Project Leader
  • 1417 posts
  • Projects: NProject Mod, Recolonize, Tidal Wars

Posted 17 December 2011 - 15:43

well, that's it. today is the assignment deadline.
in the end I only could deliver the website with HTML and CSS, with a broken gallery feature. the hardest part is when adding privileges to which users allowed to add/remove pictures in the gallery.
Posted Image
NProject Mod -- Recolonize -- Tidal Wars
Back to Code Block

2 user(s) are reading this topic

0 members, 2 guests, 0 anonymous users

  1. Fallout Studios Forums
  2. → Development
  3. → Code Block
  4. Forum rules and guidelines