

Ask HN: A modern web development workflow? - tierone

Hi HN,<p>I'm embarrassed when looking at my web development work flow, that basically hasn't changed ever since I started programming as a hobby ten years ago. I have never moved beyond writing my code, testing it locally with a standard version of WAMP and then dragging my files into an FTP client, uploading them to some unspectacular web hosting service, as if it was just another folder on my computer.<p>[Web development was never priority for me (I studied design and I work as a designer now), but I both enjoy working on small project on the side and also believe that it is my duty as a good designer to understand what it means to implement the things that I come up with.]<p>If I ever wanted to develop something that is more than just a little personal experiment on the side, I would miserably fail, because my knowledge of a serious workflow is just non existent.<p>So this is where I'm asking for your help: It's hard to learn about something that you hardly know anything about. I don't even know where to start. I would greatly appreciate to get your opinions on a good, not too complex (keep in mind that I'm not exactly trying to build the next big thing here), modern and professional workflow that shows me a more serious side of web development than Notepad and Filezilla.
What are the keywords I can use to start learning about this? What are the programs and technologies that you use yourself and that you would recommend? What are the absolute nonos, that expose an absolute amateur?<p>Thanks!
======
sdrinf
> What are the keywords I can use to start learning about this?

It's really comes down to personal choices (see the discussions about vi vs
emacs), and for this reason, it's hard to track down quality advice -esp.
keywords. Instead, try Googling what you'd like to achieve (eg. "use ftp as
local drive"), and be amazed by the variety of tools available :)

> What are the programs and technologies that you use yourself and that you
> would recommend?

Taking care of the whole webdev site of our web-based startup, here's what my
current configuration looks like.

Assuming: Windows as the dev machine, Debian/ubuntu, or shared web hosting on
the server side

* Total commander: is my file navigator of choice -shows 2 tabs of filelist side-by-side, can bookmark any number of directories, many awesomeness included.

* Webdrive: mounts a remote FTP / SFTP / SSH account as a local drive. Check the "support for FTP" requirement off of your texteditor of choice.

* Putty: if you've got shell access to the remote machine, running two of these parallel: tail -f ./access.log tail -f ./errors.log will give you a realtime view of what's happening of your web server, and what error messages did you generated -the later isn't always readily available, esp. if you start getting into ajax

* Notepad++ : has a nice syntax highlighting, an awful lot of shortcuts, support for unix-encoding (on windows), amongst many features.

* Git: you will need to do version control.

Here's how this works together:

* Have 2 machines, 1 for dev, 1 for live, both using a dedicated machine, and a database of it's own. (quick intro how to set up a staging server: [1] )

* Webdrive mounts dev machine's web directory via SSH. All changes are securly transmitted to the server.

* REPL[2] cycle: navigate to the target of interest in Total commander, hit F4 (opens it in Notepad++), do some changes, hit CTRL+S (Webdrive automagically uploads the file), ALT+TAB (chrome), F5 (page refresh), observe changes / errors, ALT+TAB (back to notepad++), bang away. Added bonus: you'll see what you'll get while being deployed on a linux server (the differences between a WAMP, and a LAMP server can be quite a pain)

This allows for a REPL-cycles clocking <2sec, which I found hard to beat for
remote-based REPLs :)

* Once the features are tested, and pre-deploy checklist is done, git add ./ , and git commit will push this into local git repo. Then, on the live-server's side, do a git pull ssh://[staging-server] ,and it's live. If you're having "a learning experience", you can always git reset to a previous version.

> What are the absolute nonos, that expose an absolute amateur?

Standard FTP-based transfer is malleable to Man-in-the-middle attacks[3].
Notepad usually does \r\n instead of \n, which caused me some headaches with
older versions of readline/writelines. Putting together design in notepad is
possible, but massively sub-optimal: try sketching it with photoshop, generate
some skeletons, and use this as a starting point. Local development
(requesting from 127.0.0.1) allows using several javascript capabilities,
which aren't available for public deployed sites.

I think this should you a good headstart, comment below if you have any
questions :)

[1] [http://www.kalzumeus.com/2010/12/12/staging-servers-
source-c...](http://www.kalzumeus.com/2010/12/12/staging-servers-source-
control-deploy-workflows-and-other-stuff-nobody-teaches-you/)

[2] <http://en.wikipedia.org/wiki/REPL>

[3] <http://en.wikipedia.org/wiki/Man-in-the-middle_attack>

------
larsen
Version control. You can observe the benefits even working alone on relatively
small projects. And it's one of the pillars to experiment with more reliable
ways of deploying software

~~~
HackrNwsDesignr
whats a good one to use for single devs/small teams?

~~~
larsen
I use git at work and for personal stuff. The learning path is maybe a bit
steep if you come from things like Subversion, on the other hand I instructed
a developer new to VCSs and so far he didn't complain, shoot his foot, or
shoot mine :)

git is only my personal preference, generally speaking I recommend to go for a
distributed version control system: it's modern, it's mainstream, and it's
more versatile in terms of workflows you can implement.

------
imperialWicket
If a lot of your projects end up on shared hosting solutions, it's difficult
to streamline effectively. Depending on the provider and the hosting tier
(single domain, unlimited, whatever), SSH access may be available or not. For
a lot of those hosting arrangements, a process centered around FTP is the
safest.

Given that limitation, I would definitely echo the importance of version
control, and then highlight that a text editor capable of edits over an FTP
connection can save a lot of trouble. I like UltraEdit, although it's
commercial - it does have a full use trial period though. On Windows, I
believe Notepad++ and Crimson Editor will also support edits over FTP. Be
careful with an FTP capable text editor though, it's easy to make changes
outside of your vcs this way.

------
vladd
If you're bold enough to switch to server-side JavaScript and move your coding
inside the browser, there's a step-by-step tutorial for Erbix at
<http://www.erbix.com/documentation/tutorial/> that describes how to get
started. (disclaimer: I'm affiliated with the project)

~~~
clyfe
If Heroku taught us something, it's developing apps inside the browser is not
lucrative. Learn from them and provide git push deploy. Bonus points: better
Web DB interface, DB import-export.

PS. It's nice to see such Romanian projects.

------
tortilla
I think rails tutorial is great even if you aren't interested in Rails. It
covers git, heroku, and testing.

<http://ruby.railstutorial.org/ruby-on-rails-tutorial-book>

------
tierone
Thanks everyone for your suggestions. Looking forward to check all this out
over the weekend.

------
dave1619
You might want to check out Coda by the guys at Panic (Transmit). They're
basically putting tools together for hand coders who do html, css, etc.

------
HackrNwsDesignr
would love to see an answer to this as well.

