GreekTuts » Τεχνολογία

Google Font API, Font Directory

Pantso — Fri, 21 May 2010 09:57:52 +0000

H Google πρόσφατα ανακοίνωσε το νέο Font API και το νέο Font Directory. Τι σημαίνει αυτό για εμάς; Πολλά ! Όλα τα εργαλεία για να προσθέσουμε custom fonts στις ιστοσελίδες μας, είναι πλέον μερικά κλίκ μακριά.

Πως χρησιμοποιώ το Font Directory και το Font API;

To μόνο που έχουμε να κάνουμε είναι να συμπεριλάβουμε σαν stylesheet το font από το Google Directory στο της σελίδας μας. Δείτε το παράδειγμα παρακάτω






untitled




Hello World

Τι κερδίζουμε χρησιμοποιόντας το Font API;

Ελατωμένη χρήση bandwidth (το βάρος το επωμίζεται η Google)
Ταχύτητα λόγω Caching (ίδια fonts που χρησιμοποιούνται σε ιστοσελίδες, αποθηκεύονται στους browser μας)
Γενικότερη ταχύτητα (Το Google’s CDN είναι γρηγορότερο από κάθε ιστοσελίδα)

Μπορείτε να βρείτε περισσότερες οδηγίες και την λίστα με τα διαθέσιμα fonts εδώ

Μαθήματα ECDL

Pantso — Fri, 14 May 2010 06:35:31 +0000

ECDL

Το ECDL είναι ένα παγκοσμίως αναγνωρισμένο Πρόγραμμα Πιστοποίησης, το οποίο ακολουθεί τις ίδιες προδιαγραφές και μεθοδολογία σε ολόκληρο τον κόσμο και πιστοποιεί γνώσεις Πληροφορικής και δεξιότητες στη χρήση Υπολογιστή, σε εισαγωγικό, βασικό, προχωρημένο και επαγγελματικό επίπεδο. Το Πρόγραμμα ECDL καλύπτει 146 χώρες, μέσα από ένα δίκτυο 17.000 Εξεταστικών Κέντρων σε όλο τον κόσμο.

ECDL Core

Μέσα από την σειρά βοηθημάτων που ξεκινάει τον Ιούνιο, θα μάθουμε όλα όσα χρειαζόμαστε για να περάσουμε τις Core εξετάσεις του ECDL. Αναλυτικότερα θα μάθουμε τα εξής :

Βασικές Έννοιες Πληροφορικής και Επικοινωνιών (ΤΠΕ)

Χρήση Υπολογιστή και Διαχείριση Αρχείων

Επεξεργασία Κειμένου

Υπολογιστικά Φύλλα

Χρήση Βάσεων Δεδομένων

Παρουσιάσεις

Πλοήγηση στον Ιστό και Επικοινωνία

ECDL Expert

Επίσης, για όλους τους σύνδρομητές μας, μετά την ολοκλήρωση των παραπάνω τομέων, θα προσφέρονται βίντεομαθήματα με όλα όσα χρειαζόμαστε για το επόμενο επίπεδο του ECDL το Expert. Αναλυτικότερα θα μάθουμε τα εξής :

Σχεδιασμός μέσω Η/Υ (ECDL CAD),

Επεξεργασία εικόνας (ECDL ImageMaker)

Σχεδιασμός και διαχείριση ιστοσελίδων (ECDL WebStarter)

EDIT: Λυπούμαστε αλλά λόγο έλειψης προσωπικού, τα βοηθήματα για το ECDL θα ξεκινήσουν τον Σεπτέμβριο.

Περισσότερα λοιπόν τον Σεπτέμβριο

CSS3 και HTML Στοιχεία

Pantso — Wed, 03 Mar 2010 09:39:16 +0000

HTML

Πρώτα απόλα ας δημιουργήσουμε μια απλή φόρμα με τα κλασσικά στοιχεία που μπορεί να βρεί κάποιος σε μια φόρμα επικοινωνίας. Δημιουργούμε ένα κενό αρχείο html και γράφουμε τον κώδικα που ακολουθεί:





CSS3 και HTML Στοιχεία - GreekTuts









Name




E-mail




Website







 Male

 Female



I have a bike:



I have a car:



I have an airplane:

Aφού λοιπόν έχουμε έτοιμη την σελίδα μας ας δούμε τι μπορούμε να κάνουμε σε ότι αφορά την εμφάνιση της.

CSS & CSS3

Αν παρατηρήσουμε στην γραμμή 7 έχουμε συνδέσει ένα αρχείο css. Αυτό το αρχείο θα δημιουργήσουμε και θα το ονομάσουμε style.css

Μέσα λοιπόν θα αρχίσουμε να διαμορφώνουμε την φόρμα μας. Έτσι γράφουμε

body { padding:50px 100px; font:13px/150% Verdana, Tahoma, sans-serif; }

Αυτό είναι για να δώσουμε μια συγκεκριμένη θέση στην φόρμα μας. Συνεχίζουμε προσθέτοντας όλα τα στοιχεία της φόρμας μας.

input, textarea {
}

textarea {
}

input:hover, textarea:hover,
input:focus, textarea:focus {
}

.form label {

}

.submit input {
}

Τώρα το μόνο που έχουμε να κάνουμε έιναι να διαμορφώσουμε όπως θέλουμε τα στοιχεία. Έτσι γράφουμε

input, textarea {
padding: 9px;
border: solid 1px #E5E5E5;
outline: 0;
font: normal 13px/100% Verdana, Tahoma, sans-serif;
width: 200px;
}

textarea {
width: 400px;
max-width: 400px;
height: 150px;
line-height: 150%;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
border-color: #C9C9C9;
}

.form label {
margin-left: 10px;
color: #999999;
}

.submit input {
width: auto;
padding: 9px 15px;
background: #617798;
border: 0;
font-size: 14px;
color: #FFFFFF;
}

Αν κάνουμε τώρα μια προεπισκόπηση θα δούμε ότι έχουμε ορίσει το πλάτος, το περίγραμμα, αποστάσεις και χρώματα. Τελειώνοντας με την φόρμα μας θα προσθέσουμε και ένα ντεγκραντέ εφέ χρησιμοποιόντας μόνο css.

input, textarea {
padding: 9px;
border: solid 1px #E5E5E5;
outline: 0;
font: normal 13px/100% Verdana, Tahoma, sans-serif;
width: 200px;
background: #FFFFFF url('bg_form.png') left top repeat-x;
background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
}

textarea {
width: 400px;
max-width: 400px;
height: 150px;
line-height: 150%;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
border-color: #C9C9C9;
-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}

.form label {
margin-left: 10px;
color: #999999;
}

.submit input {
width: auto;
padding: 9px 15px;
background: #617798;
border: 0;
font-size: 14px;
color: #FFFFFF;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
cursor: pointer;
}

Με μια προεπισκόπηση θα δούμε ότι η φόρμα μας έχει γίνει αγνώριστη. Να σημειώσουμε ότι η επιλογή -moz- μιλάει στον firefox. Η αντίστοιχη για όλους τους άλλους browsers είναι -webkit- για τον safari και χρειαζόμαστε εικόνα για τον IE. Η εικόνα που χρησιμοποιούμε είναι στην συγκεκριμένη περίπτωση αυτή

CSS3 Gradients

Αναλυτικά με τα gradients η εντολή που δίνουμε είναι η εξής.

div {

background-color: #1a82f7; /* fallback color */

background-image: url(images/linear_bg_2.png); /* fallback image */

background-image: -moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);

background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));

}

Ας δούμε ένα παράδειγμα. Δημιουργούμε ένα νέο html αρχείο και γράφουμε






CSS3 Gradiet













CSS3 Gradient

Linear background


#linearBg {
height: 100px;
background-color: #1a82f7; /* fallback color */
background-image: url(images/linear_bg_2.png); /* fallback image */
background-image: -moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));
}

Η εικόνα που θα χρησιμοποιήσουμε είναι αυτή.

Κάντε μια επισκόπηση και θα δείτε ένα απίθανο gradient φτιαγμένο με CSS.

5 Ελληνικά iPhone Apps

Pantso — Sat, 23 Jan 2010 15:16:20 +0000

Sport24

Η μεγάλη αθλητική ειδησεογραφική ιστοσελίδα, ανέπτυξε ένα από τα καλύτερα ελληνικά iPhone Apps, που σας δίνει την δυνατότητα να διαβάζετε καθημερινά όλα τα αθλητικά νέα καθώς και τα αθλητικά πρωτοσέλιδα από το αγαπημένο σας site, όπου κι αν βρίσκεστε, εύκολα και γρήγορα. H εφαρμογή έχει σχεδιαστεί αποκλειστικά για κινητές συσκευές της Apple (iPhone και iPod Touch) και προσφέρει μια σειρά από χαρακτηριστικά τα οποία σας βοηθούν να βλέπετε το περιεχόμενο του Sport24.gr στο κινητό σας.

Κατεβάστε το από εδώ

Athensbook

Το Athensbook, αξιοποιεί την λειτουργία εντοπισμού θέσης του iPhone για να σε βοηθήσει να βρεις σημεία ενδιαφέροντος στην περιοχή που βρίσκεσαι εκείνη τη στιγμή. Σου δίνει επίκαιρη πληροφορία και ορισμένες άλλες λειτουργίες που δεν θα βρεις στη μέση συσκευή GPS του εμπορίου (ή στις κάλύτερες σε κάποιες περιπτώσεις). Μπορείτε να βρείτε γρήγορα τα κοντινότερα φαρμακεία, βενζινάδικα, νοσοκομεία, ATMs, μουσεία, εστιατόρια, δημόσιες υπηρεσίες και άλλα πολλά.

Κατεβάστε το από εδώ

Avopolis

Στο Application του γνωστού μουσικού portal avopolis.gr, μπορούμε να ενημερωθούμε για τα δρώμενα στις μουσικές σκηνές την Ελλάδας, για θέατρο, για νέα άλμπουμ ελληνικής και ξένης μουσικής, και για νέα της γενικότερης μουσικής σκηνής. Αξιοσημείωτο είναι ότι το application είναι free για να το αποκτήσετε.

Κατεβάστε το από εδώ

Videorama

Στην εφαρμογή του videorama.gr μπρούμε να ενημερωθούμε για τις νέες ταινίες που κυκλοφορούν, για όσες έρχονται, και να διαβάσουμε κριτικές και reviews για ταινίες που υπάρχουν ήδη. Μπορούμε να δούμε trailers των ταινιών, καθώς και όλες τις γενικές πληροφορίες για την ταινία. Τέλος έχουμε πλήρη πρόσβαση σε όλο το περιεχόμενο της ιστοσελίδας.

Κατεβάστε το από εδώ

iSteam

Κλείνουμε με ίσως το πίο γνωστό και πετυχημένο ελληνικό iPhone Αpp. Το όνομα του iSteam. Αυτή η εφαρμογή εξομοιώνει την υγρασία σε ένα τζάμι, και μας επιτρέπει να γράψουμε πάνω του, όπως όταν θολώνουμε το τζάμι με την αναπνοή μας.

Κατεβάστε το από εδώ

HTML5 : Χρήσιμες Ιστοσελίδες

Pantso — Tue, 15 Dec 2009 11:03:14 +0000

HTML5 and The Future of the Web

Get Ready for HTML 5

CSS code structure for HTML 5: some useful guidelines

HTML 5 Tutorial – A Simple Web Page Layout

HTML5: The Basics (1 of 4)

A Preview of HTML 5

Steve Smith on HTML5 and CSS3

HTML5 Doctor

The Future of HTML 5

5 Exciting Things to Look Forward to in HTML 5

Yes, You Can Use HTML 5 Today!

HTML 5 Pocket Book

HTML 5 PDF Cheat Sheet

HTML 5 Visual Cheat Sheet by Woork

HTML5 Draft Standard

Πηγή άρθρου Line25.com

Μενού με CSS και jQuery

Pantso — Mon, 23 Nov 2009 10:20:13 +0000

Θα υποθέσουμε ότι έχουμε ήδη το αρχείο index.html έτοιμο, και αν δεν το έχουμε θα το δημιουργήσουμε.

Στην αρχή θα χρειαστεί να δημιουργήσουμε το μενού μας. Έτσι ανάμεσα στα tags της ιστοσελίδας μας θα προσθέσουμε τον κώδικα



Κεντρικη
Σχετικα
Υπηρεσιες
Φωτογραφιες
Πελατες
Επικοινωνια

Επίσης πρέπει να δημιουργήσουμε την εικόνα που θα χρησιμοποιηθεί για το animation στο μενού μας. Δημιουργούμε λοιπόν μια εικόνα 1×80, Φροντίζουμε να καλύψουμε τα πρώτα 40 pixels με ένα χρώμα και τα άλλα 40 pixels με άλλο χρώμα. Κάτι σαν την εικόνα που ακολουθεί.

Πλέον έχουμε το μενού μας σε μορφή unordered list και την εικόνα για το μενού μας. Τώρα θα μορφοποιήσουμε λίγο την εμφάνιση και θα προσθέσουμε την εικόνα παρασκηνίου του μενού. Δημιουργούμε το αρχείο style.css στο οποίο γράφουμε τον παρακάτω κώδικα. Έχουμε προσθέσει και κάποια σχόλια για καλύτερη κατανόηση του κώδικα.

ul#topnav {
margin: 0;
padding: 0;
list-style: none;
float: left;
font-size: 1.1em;
}
ul#topnav li{
margin: 0;
padding: 0;
overflow: hidden;  /*--Σημαντικό - Απόκρύπτει την εικόνα μας πρίν το hover--*/
float: left;
height:40px;
}
ul#topnav a, ul#topnav span { /*--Tα  και  έχουν τις ίδιες ιδιότητες--*/
padding: 10px 20px;
float: left;
text-decoration: none;
color: #fff;
background: url(a_bg.gif) repeat-x;
text-transform: uppercase;
clear: both;
width: 100%;
height: 19px;
line-height: 20px; /*--Κάθετη διαμόρφωση του κειμένου--*/
}
ul#topnav a{ /*--Το hover state του μενού μας--*/
color: #555;
background-position: left bottom;
}
ul#topnav span{ /*--Η αρχική κατάσταση του μενού μας--*/
background-position: left top;
}

.container {
height:330px;
left:50%;
margin:-140px 0 0 -450px;
overflow:hidden;
position:absolute;
top:50%;
width:978px;
}

Θα συνδέσουμε το αρχείο του στυλ με την ιστοσελίδα μας πρεοσθέτωντας τον παρακάτω κώδικα στο κομμάτι της σελίδας μας

Τέλος θα συμπεριλάβουμε την βιβλιοθήκη jQuery και θα προσθέσουμε και το script που θα κάνει όλη την δουλειά. Πρώτα από όλα λοιπόν γράφουμε στο μέρος της σελίδας μας τον εξής κώδικα για να συμπεριλάβουμε την βιβλιοθήκη

Τελευταίο βήμα είναι να προσθέσουμε τον παρακάτω κώδικα ώστε να δημιουργήσουμε την κίνηση στο μενού όταν ο χρήστης περνάει τον δείκτη πάνω από το μενού μας. Αυτό το κάνουμε γράφοντας τον εξής κώδικα στο μέρος της σελίδας μας. Έχουμε προσθέσει και κάποια σχόλια για καλύτερη κατανόηση του κώδικα.

Αυτό ήταν. Δείτε το αποτέλεσμα κάνοντας κλίκ στο παρακάτω κουμπί
Τα αρχεία του βοηθήματος είναι διαθέσιμα σε όλους τους συνδρομητές του GreekTuts.

Άν είστε ήδη συνδρομητής κάντε login με τα στοιχεία σας. Για να γίνετε συνδρομητής πατήστε εδώ

Αντικατάσταση Κειμένου με SVG Fonts

Pantso — Fri, 13 Nov 2009 10:43:18 +0000

Σχετικά

To Cufón είναι κάτι αντίστοιχο του sIFR, αλλά σίγουρα πιό εύκολο στην χρήση και γρήγορο στην ενσωμάτωση. Κάποια βασικά στοιχεία :

Δεν χρειάζονται plug-ins
Συμβατότητα – λειτουργεί με όλους τους γνωστούς browsers
Εύκολο στην χρήση
Γρήγορο ακόμα και για μεγάλο αριθμό κειμένου

Πώς Λειτουργέι

Το Cufón χωρίζεται σε δύο μέρη. Τον font generator, που μετατρέπει τα fonts σε κατάλληλη μορφή, και την βιβλιοθήκη μετατροπής που είναι γραμμένη σε JavaScript.

Η μέθοδος που θα ακολουθήσουμε είναι πραγματικά εύκολη, αφού ουσιαστικά χρειάζεται μόνο δύο βήματα.

Βημα 1

Πρώτα από όλα πρέπει να κατεβάσουμε την βιβλιοθήκη μετατροπής. Αυτό το κάνουμε αν επισκεφτούμε το http://cufon.shoqolate.com/js/cufon-yui.js και κάνουμε File>Save As. Έχουμε λοιπόν πλέον το αρχείο cufon-yui.js στον υπολογιστή μας.

Μετά ακολουθώντας τον σύνδεσμο http://cufon.shoqolate.com/generate/ βρισκόμαστε στον font generator όπου επιλέγουμε το font που θέλουμε να μας αντικαταστήσει το κείμενο της ιστοσελίδας μας. Μην τρομάξετε από τις πολλές επιλογές.

Εδώ, επιλέγουμε το font που θέλουμε, κάνοντας browse από τον υπολογιστή μας. Έχουμε την δυνατότητα να επιλέξουμε γραμματοσειρές σε Normal, Bold, Italic, Bold Italic. Επιλέγουμε επίσης το “The EULAs of these fonts allow Web Embedding”. Από τα glyphs επιλέγουμε All και απο το Performance & Filesize επιλέγουμε “No thanks, use the font’s own value”. Αποδεχόμαστε την άδεια χρήσης και πατάμε το “Let’s Do This”

Κατεβάζουμε το αρχείο μας και το αποθηκεύουμε. Έχουμε πλέον και το αρχείο του font μας.

Βημα 2

Το μόνο που έχουμε να κάνουμε τώρα είναι να ενσωματώσουμε τα αρχεία μας στην ιστοσελίδα μας. Αυτό το κάνουμε προσθέτοντας τον εξής κώδικα στο head μέρος της ιστοσελίδας μας.

Στο συγκεκριμένο βοήθημα χρησιμοποιήσαμε το font Calibri. Έτσι το αρχείο μας ονομάζεται Calibri_700.font.js.

Τέλος για να δούμε κάποια αλλαγή χρειάζεται να προσθέσουμε στο head κομμάτι της σελίδας μας

Έτσι πλέον όλα τα H1 tags στην ιστοσελίδα μας θα αντικατασταθούν από τα SVG(Scalable Vector Graphics) Fonts που επιλέξαμε. Μπορούμε να παρατηρήσουμε ότι αν γράψουμε Cufon.replace(‘p’); αντί για Cufon.replace(‘h1′); όλες οι παράγραφοι στην σελίδα μας θα αντικατασταθούν. Μπορούμε επίσης να συμπεριλάβουμε και πολλά στοιχεία μαζί γράφοντας για παράδειγμα

Τελικό Αποτέλεσμα

Πριν την αντικατάσταση

Μετά την αντικατάσταση

Hint/Tip

Για να μπορέσετε να επιλέξετε τα fonts που θέλετε στον generator, θα πρέπει να κάνετε copy τα fonts απο τον φάκελο Fonts που βρίσκεται στο C:\Windows\Fonts κάπου εκτός από αυτόν τον φάκελο, γιατί λόγο ασφάλειας, δεν επιτρέπεται η επιλογή fonts κατευθείαν από τον φάκελο Fonts.

Άν είστε ήδη συνδρομητής κάντε login με τα στοιχεία σας. Για να γίνετε συνδρομητής πατήστε εδώ

Πέντε συμβουλές για να ανέβει το «κασέ» του κώδικά σας

KrAp — Tue, 10 Nov 2009 14:22:09 +0000

Όντας αυτές οι μίνι εφαρμογές, προϊόν εξάσκησης, σπάνια χρησιμοποιούνται από άλλους προγραμματιστές ή επαναχρησιμοποιούνται από τον ίδιο τον δημιουργό.

Η παραπάνω κατάσταση οδηγεί σε κάποιες κακές πρακτικές προγραμματισμού που έχουν σαν αποτέλεσμα την παραγωγή κακογραμμένου, δυσανάγνωστου κώδικα ο οποίος σχεδόν σίγουρα θα κάνει δύσκολη τη ζωή κάποιου άλλου προγραμματιστή ή, στην καλύτερη περίπτωση, θα καθυστερήσει το έργο.

Στο σημερινό μας άρθρο θα παρουσιάσουμε πέντε συχνά προγραμματιστικά λάθη που η αποφυγή τους οδηγεί σε αρκετά ανώτερο, ποιοτικά, κώδικα. Τυχόν παραδείγματα θα παρουσιαστούν σε Java για ευνόητους λόγους.

1. Η ονοματολογία είναι το ήμισυ του παντός

Η σωστή ονοματολογία είναι κάτι που φαντάζει απλό ωστόσο σπάνια γίνεται σωστά. Η γενική οδηγία προτείνει τα ονόματα να μην είναι ούτε πολύ μικρά, ούτε πολύ μεγάλα και να περιγράφουν με σαφήνεια την λειτουργία της εκάστοτε μεταβλητής ή μεθόδου.

Ένα παράδειγμα μεταβλητής θα μπορούσε να είναι:

private int numberOfAuthors;

αντί του:

private int nofAuthors;

και αντίστοιχα για μεθόδους:

public boolean connectToDatabase(...)

αντί του:

public boolean dbConn(...)

(πραγματικά παραδείγματα αμφότερα)

2. Μην χρησιμοποιείται ποτέ implementation types στις δηλώσεις μεταβλητών σας

ArrayList authors = new ArrayList();      //ΛΑΘΟΣ

List authors = new ArrayList();           //ΣΩΣΤΟ

Πρόκειται για λάθος που μου πήρε καιρό να αποβάλλω και οφείλεται αποκλειστικά στο γεγονός ότι για πολύ καιρό προγραμμάτιζα για τον εαυτό μου. Το να χρησιμοποιήσουμε μια τόσο συγκεκριμένη δομή όπως η ArrayList σε μια δήλωση μεταβλητής δημιουργεί προβλήματα όπως:

“Βαραίνει” τον κώδικά μας μιας και η ArrayList αποτελεί πιο πολύπλοκη δομή από την List

Μας περιορίζει στην υλοποίηση με τη λογική ότι δεν μπορούμε να χρησιμοποιήσουμε την γκάμα των υλοποιήσεων λίστας που μας προσφέρει η Java (π.χ. LinkedList κλπ.)

Εν γένει, η χρήση αφηρημένων τύπων δεδομένων βοηθά και στην καλύτερη κατανόηση του κώδικα από άτομα που έρχονται για πρώτη φορά σε επαφή με ένα κομμάτι κώδικα. Στο παραπάνω παράδειγμα η χρήση του αφηρημένου τύπου List δηλώνει ξεκάθαρα ότι σαν τύπος δεδομένων έχει επιλεγεί η λίστα, για το συγκεκριμένο κομμάτι κώδικα. Μία δήλωση τύπου ArrayList θα περιέπλεκε τα πράγματα και θα έκανε κάποιον “άσχετο” με τον κώδικα προγραμματιστή να ανατρέξει στα specifics της δομής ArrayList για να δει αν υπάρχει κάποιος ειδικός λόγος που επιλέχθηκε.

3. Copy-Paste κώδικα. Ευλογία ή κατάρα;

Εξαρτάται… Αν γίνει σωστή χρήση, τα οφέλη είναι πολλαπλά. Εδώ όμως θα αναφέρουμε τις περιπτώσεις στις οποίες πρέπει να αποφεύγεται.

Όταν χρειαστεί να επαναλάβουμε ένα τμήμα κώδικα μερικών γραμμών για να τρέξει με ένα set διαφορετικών μεταβλητών, η σωστή αντίδραση μας πρέπει να είναι η μετατροπή του τμήματος αυτού σε function ή method (ανάλογα με τη γλώσσα προγραμματισμού).

Μετατρέποντας ένα κομμάτι κώδικα που εκτελείται συχνά σε function ή method κερδίζουμε πολλαπλά:

Ο κώδικάς μας γίνεται πιο σύντομος. Αν δεν καταλαβαίνεται το κέρδος που πηγάζει από αυτήν την πρόταση περιμένετε να αντιμετωπίσετε ένα σφάλμα το οποίο βρίσκεται κάπου μέσα στον κώδικά σας και είστε αναγκασμένη να ψάξετε παντού.

Ο κώδικάς μας γίνεται πιο ευανάγνωστος και πιο κατανοητός.

Αν χρειαστεί να γίνει κάποια αλλαγή στη λειτουργικότητα του συγκεκριμένου τμήματος κώδικα ανατρέχουμε σε ένα μόνον σημείο. Σε αντίθετη περίπτωση θα έπρεπε να αναζητήσουμε όλα τα σημεία εμφάνισης και να τα τροποποιήσουμε ένα προς ένα.

Σε επίπεδο ψυχολογικό έχουμε την ικανοποίηση ότι έχουμε απομονώσει μια λειτουργία που κάνει κάτι συγκεκριμένο το οποίο θα είναι σαφές και για οποιονδήποτε άλλον κληθεί να κατανοήσει ή και να χρησιμοποιήσει τον κώδικά μας.

4. Δέσμευση μεταβλητών με τις επιστρεφόμενες τιμές μεθόδων ή συναρτήσεων

Κάποιες μέθοδοι ή συναρτήσεις επιστρέφουν τιμές. Αυτό δε σημαίνει ότι πρέπει υποχρεωτικά να τις αποθηκεύσουμε κάπου. Μία καλή τακτική είναι να δεσμεύετε μεταβλητές για επιστρεφόμενες τιμές μόνον εφόσον πρόκειται να τις χρησιμοποιήσετε.

Για παράδειγμα μία μέθοδος:

public boolean connectToDatabase(…) επιστρέφει μία boolean μεταβλητή για να δηλώσει ότι η σύνδεση έγινε με επιτυχία.

Σενάριο #1:

boolean connectedToDatabase = connectToDatabase(...);  //ΛΑΘΟΣ

(υποθέτουμε ότι η connectionToDatabase δε χρησιμοποιείται ποτέ παρακάτω)

Σενάριο #2:

boolean connectedToDatabase = connectToDatabase(...);

if( connectedToDatabase )           //ΣΩΣΤΟ

{

κώδικας...

}

else

{

System.err.println(“Could not connect to database”);

}

Σε αυτήν την περίπτωση η μεταβλητή connectedToDatabase χρησιμοποιείται για να τεστάρουμε αν έχουμε συνδεθεί επιτυχώς στη βάση (συνήθως αποφεύγουμε null pointer exception errors με αυτόν τον τρόπο).

5. Ο κώδικας σε σχόλια πρέπει να διαγράφεται

Το ξέρω ότι μπορεί να πατάω τον κάλο μερικών αλλά είναι η αλήθεια. Και η αλήθεια μερικές φορές πονάει. Για πολύ καιρό συνήθιζα να βάζω κώδικα σε σχόλια, είτε γιατί ήθελα να δοκιμάσω κάτι άλλο, είτε γιατί έπρεπε να αλλάξω την υλοποίησή του και να μην τον διαγράφω στη συνέχεια από ανασφάλεια ότι μπορεί να μου χρειαστεί στο μέλλον και να μην μπορέσω ποτέ να τον παράγω ξανά.

Όταν ένα κομμάτι κώδικα έχει αντικατασταθεί με κάτι άλλο που φαίνεται να δουλεύει ή αποτελούσε κάποιο test που δεν έχει χρησιμοποιηθεί για καιρό, πρέπει να διαγράφεται.

Με αυτόν τον τρόπο:

Δεν χάνουμε χρόνο να προσπαθούμε να καταλάβουμε τι λειτουργία επιτελούσε όταν τον είχαμε γράψει (μια φορά και έναν καιρό…).

Δεν αποσπά την προσοχή μας κάθε φορά που τον προσπερνάμε.

Δεν δημιουργεί τύψεις σε όποιον χρειαστεί να δει / χρησιμοποιήσει τον κώδικά μας. Βλέποντας ένα κομμάτι του κώδικά μας σε σχόλια το πρώτο πράγμα που θα σκεφθεί ένας προγραμματιστής είναι ότι το συγκεκριμένο κομμάτι εμφανίζει μια δυσλειτουργία την οποία κάποιος εξετάζει κάνοντας δοκιμές.

Συμβουλή προς όλους. Αν δουλεύετε σε κάποια ομάδα ανάπτυξης λογισμικού και σας δοθεί κώδικας ο οποίος περιέχει κώδικα σε σχόλια, απλά διαγράψτε τον. Εφόσον είναι σε σχόλια, σας είναι άχρηστος και δεν είστε σε καμία περίπτωση υποχρεωμένοι να μαντέψετε τον λόγο για τον οποίο ξέμεινε εκεί. Ούτως ή άλλως οι περισσότερες εταιρίες παρακολουθούν τα έργα λογισμικού καθώς εξελίσσονται και τηρούν ιστορικό τον αλλαγών. Άρα αν κάποιος, κάποτε το χρειαστεί, μπορεί να ανατρέξει σε παλαιότερες εκδόσεις και να τον εντοπίσει.

Η συγγραφή καλού κώδικα δεν αποτελεί υποχρέωση αλλά είναι καλό να γίνει συνήθεια σε όλους τους προγραμματιστές. Μπορεί να κοστίζει ελαφρώς σε χρόνο αλλά τα οφέλη μακροπρόθεσμα είναι πραγματικά πολλά. Δοκιμάστε τις παραπάνω συμβουλές και θα το διαπιστώσετε και μόνοι σας. Μέχρι την επόμενη φορά…

Να είστε καλά και να φροντίζετε τον εαυτό σας.

Πέντε μηχανές αναζήτησης για προγραμματιστές

KrAp — Sun, 01 Nov 2009 22:15:22 +0000

Μα νόμιζα ότι οι προγραμματιστές είναι hackers;

Η αλήθεια είναι ότι είναι εν δυνάμει hackers. Ωστόσο, hackers ή μη, όπως και οι περισσότεροι χρήστες ηλεκτρονικών υπολογιστών, οι προγραμματιστές χρησιμοποιούν τις μηχανές αναζήτησης.

Γιατί «για προγραμματιστές»; Το Google δεν κάνει;

Πολλές φορές οι προγραμματιστές αναζητούν έτοιμο κώδικα. Ναι, ο κώδικας προστατεύεται συνήθως, από πνευματικά δικαιώματα, ωστόσο:

Πλέον έχει γίνει της μόδας ο «ανοικτός κώδικας», κώδικας δηλαδή που μπορεί να επαναχρησιμοποιηθεί από τον οποιονδήποτε αρκεί να υπάρξει η κατάλληλη αναφορά στον αρχικό δημιουργό.
Προφανώς μπορεί να χρησιμοποιείται, χωρίς αναφορά, κώδικας που εκτελεί απλές δουλειές (όπως το να ανοίξεις ένα αρχείο .txt και να διαβάσεις το περιεχόμενο του) και μπορεί να βρεθεί σε forums. Είναι τετριμμένες διαδικασίες τα δικαιώματα των οποίων δεν ενδιαφέρουν κανέναν.

Στις παραπάνω περιπτώσεις το Google βοηθάει αλλά οι προγραμματιστές, όντας άνθρωποι, είναι από τη φύση τους άπληστοι. Τους ενδιαφέρει να πάρουν έτοιμα, όσα περισσότερα μπορούν, δηλαδή μεγάλα κομμάτια του τελικού συστήματος (ή και το ίδιο το σύστημα αν είναι εφικτό) τα οποία μετά θα τροποποιήσουν κατάλληλα ώστε να καλύψουν τις ανάγκες του πελάτη.

Δύο κιλά κώδικα παρακαλώ…

Αν έχετε απαιτητικούς πελάτες που θέλουν γρήγορες δουλειές και ζητάνε τετριμμένα πράγματα, ή απλά αν βαριέστε να χτίζετε εφαρμογές από το μηδέν, οι παρακάτω μηχανές αναζήτησης μπορεί να σας φανούν χρήσιμες (η σειρά παρουσίασης είναι τυχαία).

1. Krugle

Το Krugle (το όνομα του οποίου μπορείτε να φανταστείτε ποιανού παράφραση αποτελεί) επιτρέπει στους χρήστες του να αναζητήσουν μεμονωμένα κομμάτια κώδικα αλλά και ολόκληρα projects. Επιπλέον προσφέρει αρκετές επιλογές παραμετροποίησης όπως γλώσσα προγραμματισμού, αδειοδότηση, κλπ. Ένα ενδιαφέρον στοιχείο είναι ότι ο χρήστης μπορεί να εκτελέσει αναζήτηση στα σχόλια του κώδικα ή ακόμη και στην τεκμηρίωση (π.χ. Javadoc) εφόσον φυσικά ο αποθηκευμένος κώδικας το υποστηρίζει.

Επισκεφθείτε το Krugle εδώ

2. Koders

Το Koders αποτελεί ουσιαστικά έναν κλώνο του Krugle. Θεωρείται από πολλούς το καλύτερο site στην κατηγορία του. Προσφέρει πάνω κάτω τα χαρακτηριστικά που παρουσιάσαμε στην προηγούμενη παράγραφο επικεντρώνοντας όμως σε πληροφορίες που ενδιαφέρουν μικρές επιχειρήσεις ανάπτυξης λογισμικού και γενικά ανθρώπους που ασχολούνται επαγγελματικά με την επαναχρησιμοποίηση κώδικα. Σημαντικό πλεονέκτημά του είναι ότι δίνει στον χρήστη τη δυνατότητα να εκτελέσει μια αναζήτηση επιλέγοντας συγκεκριμένη άδεια για τον κώδικα που αναζητεί (π.χ. GPL, BSD, AFL, και πολλές άλλες).

Επισκεφθείτε το Koders εδώ

3. Google code search

Το Google Code Search αποτελεί την προσέγγιση της Google στο θέμα της αναζήτησης κώδικα. Η υπηρεσία αποτελεί μέλος του Google Labs και προσφέρει στον χρήστη τη δυνατότητα να χρησιμοποιήσει την παλιά καλή γνωστή μηχανή αναζήτησης στοχευμένη όμως αυτήν τη φορά σε κώδικα. Προσφέρει πλειάδα δυνατοτήτων αναζήτησης.

Επισκεφθείτε το Google Code εδώ

4. Open Source Search Engine

Λίγο διαφορετική πρόταση από τις προηγούμενες, η Open Source Search Engine επιτρέπει στον χρήστη να βρει Projects Ανοικτού Κώδικα που μοιάζουν με αυτό που θέλει να κάνει ώστε να μπορέσει στη συνέχεια να χρησιμοποιήσει τον κώδικά τους για λογαριασμό του. Δεν ψάχνει σε επίπεδο κλάσεων ή πακέτων απλά επιστρέφει το γονικό site των σχετικών projects που βρέθηκαν.

Επισκεφθείτε το Open Source Search Engine εδώ

5. Snipplr

Τελευταίο (αλλά όχι καταϊδρωμένο) σας προτείνουμε το Snipplr, μια υπηρεσία που φιλοξενεί κομμάτια κώδικα, ποικίλων γλωσσών προγραμματισμού, τάξης μεγέθους κλάσεως, τα οποία μπορούν να χρησιμοποιηθούν αυτούσια για απλές διαδικασίες (π.χ. ανάκτηση αρχείου σε php).

Επισκεφθείτε το Snipplr εδώ

Ελπίζουμε οι προτάσεις μας να σας φανούν χρήσιμες και να κάνουν τη δουλειά σας (ή το χόμπι σας) σαν προγραμματιστές ακόμη πιο ενδιαφέρον και δημιουργικό. Μέχρι την επόμενή μας συνάντηση…

Να είστε καλά και να φροντίζεται τον εαυτό σας.

Τα Καλύτερα Websites Στο Ελληνικό Διαδίκτυο

Pantso — Thu, 22 Oct 2009 08:21:27 +0000

www.xblog.gr

Όπως λέει και ο τίτλος, το xblog.gr είναι το #1 Ελληνικό blog ποικίλης ύλης. Ξεκίνησε τη λειτουργία του το καλοκαίρι του 2005, και μέχρι σήμερα φέρνει στον αναγνώστη όλα τα τεκτενόμενα στην Ελληνική και μη πραγματικότητα. Πίσω από την προσπάθεια αυτή βρίσκεται ο Γιάννης Καρακατσάνης, ο οποίος ξεκίνησε το xblog.gr όταν κατάλαβε την δύναμη του νέου αυτού μέσου και την αμεσότητά του με τον κόσμο. Έτσι, έχοντας δημοσιογραφικό background, έγραφε για ό,τι τον απασχολούσε από μία διαφορετική ματιά, από τα «κακώς κείμενα» μέχρι posts για την ψυχαγωγία της νεολαίας και άλλα θέματα που τον ενδιέφεραν και πίστευε ότι ενδιαφέρουν το κοινό του… Και είχε δίκιο, όπως αποδείχθηκε από την αποδοχή των αναγνωστών του.

www.gameworld.gr

Το GameWorld είναι ένα απο τα καλύτερα Ελληνικά ενημερωτικά site για video games. Με τον όρο “video games” εννοούμε όλα τα παιχνίδια που κυκλοφορούνε σε PC, κονσόλες (Playstation 3, Xbox 360, Wii), φορητές κονσόλες (PSP, DS) και άλλου είδους πλατφόρμες (όπως για παράδειγμα τα παιχνίδια στα κινητά τηλέφωνα). Το site αυτό ενημερώνει τους αναγνώστες του για τα νέα games που κυκλοφόρησαν στην αγορά αλλά και για όσα θα κυκλοφορήσουν, ώστε να έχετε μια πρώτη εικόνα για το αν θα πρέπει να αγοράσετε και να παίξετε τα παιχνίδια αυτά.

www.semifind.gr

Το Semifind ξεκίνησε την λειτουργία του τον Σεπτέμβριο του 2009 με σκοπό την παρουσίαση και προώθηση Σεμιναρίων και προγραμμάτων E-Learning που προσφέρονται στην Ελληνική αγορά και να καταστεί συνώνυμο της εύρεσης αυτών.Υπεύθυνοι της προσπάθειας αυτής είναι ο Βαδάσης Άγγελος, Χημικός Μηχανικός απόφοιτος του Πολυτεχνείου Α.Π.Θ και ο Πατούχας Λάμπρος, Οικονομολόγος Msc. απόφοιτος του Α.Π.Θ. Στόχος αποτελεί ο ενδιαφερόμενος να μπορεί με τα προσφερόμενα εργαλεία αναζήτησης που του προσφέρουμε να εντοπίσει σε ελάχιστο χρόνο το σεμινάριο που επιθυμεί αντλώντας πολύτιμες πληροφορίες όπως: Τίτλος σεμιναρίου, χρόνος και τόπος διεξαγωγής, περιεχόμενο, κόστος κ.α. προβαίνοντας στη βέλτιστη επιλογή.

Έχετε να μας προτείνετε την προσωπικη ιστοσελίδα σας ή κάποια ιστοσελίδα που επισκέφτεστε πολύ συχνά; Επικοινωνήστε μαζί μας στο contact@greektuts.net.