Ask HN: A modern web development workflow?
Hi HN,
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.
[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.]
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.
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?
Thanks! > 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... 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 whats a good one to use for single devs/small teams? 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. Anything that supports a decentralized model. Git, Bazaar, Mercurial. 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. 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) 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. I think rails tutorial is great even if you aren't interested in Rails. It covers git, heroku, and testing. Thanks everyone for your suggestions. Looking forward to check all this out over the weekend. 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. would love to see an answer to this as well.