Domača » Oblikovanje spletnih strani » Spletni razvijalec Resources Mega-Compilation

    Spletni razvijalec Resources Mega-Compilation

    Internet nenehno narašča in obstaja več sto tisoč kolektivnih virov za prihajajoče spletne razvijalce. Iz spletnih člankov, vadnic, orodij, vodnikov, videoposnetkov se lahko na spletu naučite skoraj vse. Nikoli ni bilo lažje skočiti na spletu!

    Spodaj sem sestavil veliko zbirko nekaterih zelo koristnih virov spletnih razvijalcev. Ti vključujejo gradivo za začetnike za HTML5 / CSS3 skupaj z bolj zapletenimi teorijami za programiranje JavaScript in PHP. Možno je, da nekaj navdušenih razvijalcev preuči te jezike in zgradi zelo priljubljene spletne aplikacije, podobne Twitterju ali Tumblr. Če vas zanimajo koristna sredstva za moderne spletne razvijalce, vam bo všeč ta kompilacija zanesljivih virov.

    Koristne spletne revije

    Svet bloganja je eksplodiral z več sto tisoč novimi pisatelji, ki so prihajali na internet. Mnogi od teh spletnih dnevnikov so osredotočeni na oblikovanje in razvoj spletnih strani. Lahko najdete veliko koristnih virov, ki jih samo flipping teh virov RSS.

    Odvisno od vrste jezika, ki ga kodirate, bo določil vaše zanimanje za katerega koli od teh spletnih dnevnikov. Osredotočimo se lahko na razvoj spletnih strani in predpostavimo, da to vključuje vse front-end delo (HTML5 / CSS3 / JavaScript), kot tudi preproste skripte v ozadju (PHP / RoR / Python / SQL). Sprejel sem svobodo pri sestavljanju enega seznama najbolj priljubljenih spletnih dnevnikov, ki se osredotočajo na prednjo in zadnjo kodo.

    • Nettuts+
    • 24 načinov
    • Spletna tipka
    • Smashing Coding
    • Webitect
    • Preglej element
    • Kode, ki kodirajo
    • Line25 Web Design Blog

    Gotovo je veliko drugih. Priporočamo, da v Google iščete vadnice in članke na želenem dev jeziku. Nato lahko s pomočjo zbirke virov RSS, kot je Google Bralnik, nastavite sezname vseh najnovejših člankov iz teh revij. To je odličen način, da začnete svoj delovni dan, ali celo, da ubijete nekaj časa chugging skozi tutorials.

    jQuery Plugins v izobilju

    Oba knjižnica jedra jQuery in jQuery Mobile sta v zadnjem letu pridobila veliko vleke. Te odprte izvorne knjižnice si prizadevajo oblikovati sprednje izkušnje, polne bogate animacije in enostavnih funkcij Ajax, čeprav mobilna knjižnica ni povsem ujela svojega starša v smislu vtičnikov in kode tretjih oseb..

    Podobno lahko uporabite še en fantastičen izdelek bgStretcher kot dinamični scenarij v ozadju. Zajemal bo vrsto slik in nekaj velikosti sorazmerno sorazmerno z ločljivostjo vašega zaslona. Oglejte si čudovito predstavitev, da vidite to v akciji. Oba vtičnika sta brezplačna za nalaganje in se obnašata kot preprosti primeri za odlično kodo tretje stranke, ki je zgrajena iz jQuery. Delo s temi viri vam bo prihranilo veliko časa pri projektnem delu, tako da vam ni treba ponovno izumljati kolesa.

    Na splošno priporočam tudi brskanje po spletnih straneh Ajax Blender in Dynamic Drive za JavaScript kode. Knjižnica ni velika, vendar nenehno narašča z novo vsebino, ki jo posredujejo uporabniki. Spletne strani ne vključujejo samo vtičnikov jQuery, ampak tudi knjižnice MooTools in Prototype.

    Če boste na koncu delali z knjižnico jQuery Mobile, želim priporočiti drugo orodje jqmPhp. To je dinamičen razred PHP, kjer lahko sklicujete preproste funkcije na izhodne linije in linije HTML5 kode, ki jo poganja jQuery Mobile. To je resnično najlažji način za prototip dinamičnih mobilnih aplikacij, zgrajenih okoli lupine PHP. Spletni blog ima veliko primernih referenc za prebiranje.

    Zgradba v HTML5 in CSS3

    Ko govorimo o front-end razvoju spletnih strani, je na splošno vse o učinkovitosti. Nimate enakih težav pri ustvarjanju spletne strani v HTML / CSS, kot bi kodirali vmesno aplikacijo Ruby. Ni resnične logike ali ravnanja z napakami v HTML-ju - gre predvsem za to, kako hitro lahko ustrezno prilagodite obliko postavitve v vseh brskalnikih.

    Najprej moram začeti s priporočilom HTML5 Boilerplate. To je stripped golo kosti predlogo, ki vključuje vse “standard” Elementi spletne strani HTML5 v enem paketu. To vključuje privzeto slogovno datoteko, JavaScript, ikono za ikone in veliko drugih pripomočkov. To je 100% brezplačen projekt in lahko celo prispevate k njihovemu Github repu. To je nujno potreben vir za vse razvijalce, preden se začne s katerim koli resnim spletnim projektom.

    Zdaj, če boste odpravili to predlogo, potem imate možnost, da dodate vse svoje lastne kode. Predlagam, da naredite naslednji korak in zgradite aplikacijo, kot je Initializr. To bo ustvarilo tipično postavitev spletnega mesta in vam celo omogočilo, da prilagodite elemente, ki so vključeni v vaši predlogi. Koda Google Analytics, pomanjšane datoteke jQuery, .htaccess ali web.config, poleg tega pa so na voljo še ducat drugih možnosti.

    CSS Designers

    Zdaj, ko smo malo pogledali v kodiranje HTML5, bi morali razmisliti tudi o nekaterih priljubljenih ogrodjih CSS3. Te so bolj odprte kot HTML predloge, saj lahko s CSS storite veliko več. Oblikovalci se bodo zavedali tudi težav pri izdelavi kodeksa, skladnega s standardi, za vse sodobne spletne brskalnike.

    Sistem Golden Grid je fantastičen kot okvir za odzivne spletne modele. Te postavitve se bodo prilagodile mobilnim zaslonom in preklopile navznoter, ko boste spremenili velikost okna brskalnika. Pomaga tudi pri načrtovanju širine in velikosti vsakega stolpca. Blueprint je še en priročen okvir CSS, ki ga morate preveriti. Odličen je za izdelavo spletnih strani po meri in ponuja fantastično dokumentacijo.

    Ko gre za CSS orodja, pa mora biti CSS3 PIE v mojih prvih treh priljubljenih. To je preprosta spletna aplikacija, ki prikaže ustrezno kodo za prikaz učinkov CSS3 v Internet Explorerju 6-9. Z nastavljivimi nastavitvami lahko ustvarite dinamične linearne gradiente, zaobljene vogale in senčne polja. Spletna stran vsebuje tudi primere IE, če jih želite preveriti.

    Razvijalci bodo tudi želeli zmanjšati velikost datotek za proizvodnjo. Clean CSS je eden od virov, kjer lahko izbirate med številnimi možnostmi za poenostavitev kode in zmanjšanje velikosti datoteke. Druga alternativa Code Beautifier ne ponuja toliko možnosti, ampak jo je lažje uporabljati.

    Prilagajanje tem z WordPressom

    WordPress objavljanje je enostavno najbolj priljubljen CMS v tem obdobju. Videli smo morda milijone novih spletnih dnevnikov in spletnih mest, ki jih poganja ta fantastična rešitev za upravljanje vsebin. In kot taki WordPress razvijalci so v veliko povpraševanje po gradnji meri widgets in spletne strani teme.

    Nova različica The Constellation Theme ponuja razvijalcem WordPress lažjo izhodiščno točko kot privzete predloge. Nova tema Twenty Eleven je zelo zvita in minimalistična, vendar ne more tekmovati s celotno tematsko predlogo, zgrajeno na vrhu HTML5Boilerplate. Tema Constellation WP vključuje tudi medijske poizvedbe za različne ločljivosti naprav, kot so tablični računalniki iPhone in iPad.

    Wonderflux je še ena WordPress tematska predloga, ki ni tako daleč v razvoju. To je bil šele pred kratkim izpust iz beta v v0.0 skupaj z nekaj online dokumentacijo. Ta tema je nekoliko bolj zapletena kot Constellation, ki vam daje večji nadzor nad postavitvijo. Razvijalci so vključevali kljuke po meri, funkcije in filtre, da bi vaše spletno mesto WordPress postalo bolj dinamično.

    Resni razvijalci WP bi morali preveriti obe rešitvi, da bi videli, ali bi katera od njih pomagala pri prihodnjem projektnem delu.

    Iskanje spletnih razvijalcev Freebies

    V primerjavi z PSD-ji in grafiko se skupnost za razvoj spletnih strani zdi malo manjkajoča v freebie galerijah. V Githubu lahko vedno najdete odlične skripte, vendar jih boste morali pogosto iskati in jih sami preizkusiti.

    Težko je najti spletne strani, ki ponujajo brezplačne prenose in predstavitve ter primere skriptov. Moj najljubši novi vir je CodeVisually, ki katalogizira uporabniško predložena razvojna orodja, vtičnike, knjižnice in druge čiste stvari. Postavitev je nastavljena kot galerija, kjer vsaka stran vsebuje povezavo do izdelka, demo posnetek zaslona in nekaj dodatnih podrobnosti.

    V galeriji je na stotine primerov kode HTML, HTML5, knjižnice CSS3 in tudi veliko stvari jQuery. Ugotovil sem tudi, da je to odlična spletna stran, da lahko javnosti pošljete svojo odprto kodo. Vaše ime je povezano s predložitvijo, poleg tega pa lahko na svoje spletno mesto postavite povezave, kjer lahko uporabniki dostopajo do kode.

    API-ji za spletne aplikacije

    Zelo priljubljen trend v sodobnem spletnem razvoju je izgradnja API-jev kot aplikacije tretje osebe. Večina glavnih družbenih omrežij vključuje delovni API in segment dokumentacije neposredno na svoji spletni strani. Poleg tega so na Githubu na voljo številni brezplačni razredi v vseh glavnih jezikih programiranja.

    Razvijalci bi se morali počutiti udobno pri delu s temi vrstami kodnih knjižnic, saj se njihovo povpraševanje povečuje. S sistemom OAuth lahko hitro zgradite uporabniško bazo iz mnogih od teh aplikacij. V nadaljevanju sem navedel le nekaj sklicev na priljubljene spletne vmesnike API in njihovo celotno dokumentacijo.

    • Twitter API
    • API za CloudApp
    • Instagr.am API
    • eBay API
    • API za Foursquare
    • Dribble API
    • Github API

    Izkoristite te vire pri novih projektih, kadar koli je to mogoče. Splet postaja vse bolj povezan in uporabniki se vedno zležejo v naslednjo veliko aplikacijo. V svojo aplikacijo lahko zaposlite več tisoč namenskih članov, ko obiskovalcem ni treba registrirati novega računa in se lahko namesto tega prijavijo neposredno prek storitve Twitter ali Facebook..

    Viri za vprašanja in odgovore

    Najbolj koristna izkušnja med razvijalci je postavljanje vprašanj in učenje novih tehnik. Skupnost razvijalcev je vedno v pomoč novincem in je pripravljena ponuditi svoje strokovno znanje v mnogih situacijah. Če imate težave ali določena vprašanja v zvezi s projektom, v Googlu poiščite soroden forum razvijalcev spletnih mest.

    Osebno moram priporočiti, da se pridružite skupnosti Stack Exchange, če še niste član. To vključuje neverjetne spletne strani, kot so Stack Overflow in Super User, kjer lahko dobite programsko pomoč v bistvu ničesar. Člani skupnosti poznajo vse glavne spletne jezike, vključno z jQuery in manjšimi razredi PHP.

    Čeden trik, ki sem se ga naučil, je, da iščem po Googlu in vidim, ali je vaša težava že rešena. V iskalnik Google vnesite nekaj ključnih besed in dodajte pripono stran: stackoverflow.com. Vsi vrnjeni rezultati iskanja bodo vprašanja iz arhivov prekoračitve skladov - če imate srečo, boste morda našli točno rešitev za trenutno težavo.

    Testiranje hitrosti strani na spletu

    To novo orodje, ki ga je razvil Google Developers, je bilo res impresivno. Aplikacija Page Speed ​​Online bo analizirala vsebino vaše spletne strani in ustvarila analitično poročilo o vaših hitrostih. To vključuje možne rešitve za zmanjšanje časa nalaganja in vaše obiskovalce na spletnem mestu dlje časa.

    Pomaga vam tudi pri ugotavljanju težav s stopnjami obiskov ene strani in nižjimi pretvorbami. Google Analytics je za vsako spletno mesto nujno potreben, vendar menim, da je hitrost strani dosegla višjo raven analize.

    Izhodišče poročila je razvrščeno od prednostne do visoke in pogosto vključuje veliko različnih elementov. Če razumete nastavitve LAMP in delate na strežnikih Apache, lahko razmislite tudi o modulu mod_pagespeed. Samodejno izvede veliko teh optimizacij na vašem spletnem mestu, da zmanjša čas nalaganja in predpomni pomembne spletne podatke (slike, ikone, skripte).

    Programska oprema najboljšega razvijalca

    Med dvema najbolj priljubljenima operacijskima sistemoma lahko najdete na ducate programov. Od grafične programske opreme do urejevalnikov izvorne kode in IDE-jev je na voljo veliko virov za izbiranje spletnih razvijalcev. Toda če iščete priljubljene predloge, vam priporočam naslednje naslove.

    Mac OS X

    Panic je programska družba, ki je ustvarila Coda - daleč najboljši spletni razvojni program za Mac. Imate dostop do urejevalnika izvorne kode, odjemalca terminala in odjemalca FTP, kjer lahko spreminjate neposredno v datoteke strežnika. Coda dodatno podpira dolg seznam poudarjanja skladenj za jezike, kot so HTML, XML, CSS, JavaScript, PHP, SQL in še veliko več..

    Če pa potrebujete brezplačno rešitev, si oglejte Komodo Edit. Programska oprema je razvita za Windows in Mac, odprtokodna in popolnoma brezplačna za prenos. Vključuje vse enake podpore za poudarjanje skladenj in veliko podobnih funkcij kot Coda (na žalost ni FTP). TextWrangler je še ena brezplačna rešitev, ki jo boste morda želeli poskusiti, prav tako pa preprosto urejevalnik besedila.

    Za brezplačno aplikacijo FTP si oglejte Cyberduck v trgovini Mac App Store. Čeprav osebno imam raje plačano alternativo, kot je Yummy FTP ali Transmit.

    Microsoft Windows

    Paket programske opreme Adobe vedno pride na misel, ko razmišljate o oblikovanju in razvoju spleta. Uporabniki operacijskega sistema Windows imajo veliko možnosti za Dreamweaver in mnogi od njih so popolnoma brezplačni.

    Notepad ++ je odličen primer nekaj odprtokodne programske opreme Win32. Projekt se še vedno razvija in pogosto posodablja (skoraj mesečno) posodobitve. Všeč mi je njihov vmesnik z zavihki in podpora za toliko dodatnih vtičnikov. Kot sem omenil zgoraj, je Komodo Edit na voljo tudi za Windows XP / Vista / 7, tako da lahko poskusite to kot alternativo.

    Spletni razvijalci v operacijskem sistemu Windows tudi niso brez odjemalca FTP. Filezilla je verjetno najbolj priljubljena brezplačna alternativa. Za druge možnosti si oglejte naš brezplačni seznam strank FTP skupaj s podobnimi orodji.

    Drugi koristni Dev Resources

    • 100 Bistvena orodja za razvoj spletnih mest
    • Best Of 2011: Najboljši uporabni vtičniki in vadnice jQuery
    • Ruby on Rails Vaje za začetnike razvoja spletnih strani
    • 7 Razburljivi trendi spletnega razvoja za leto 2011

    Zaključek

    Do sedaj se je prva četrtina leta 2012 začela z bang! Opazili smo že nekaj neverjetnih vsebin oblikovalcev in spletnih razvijalcev z vsega sveta. Strokovnjaki, ki gradijo za splet, imajo na voljo toliko orodij kot pred 1-2 leti.

    Upam, da bo ta ogromna zbirka orodij in virov spodbudila vašo metodologijo za boljši razvoj. Rad delam z razvijalci spletnih strani in ves čas spoznavam nove projekte. Kljub temu pa je prostora za nove vire, ki jih lahko vključimo, zato sem nedvomno zamudil nekaj draguljev. Če imate ideje ali predloge za povezane vire spletnih razvijalcev, nam to sporočite na območju za razpravo.