How to Become a Web Developer

A 90 minute presentation given to Boston PHP that explains how to become a Web developer. In it, I outline the technologies you would need to learn, and in what order, as well as provide the big picture of how these technologies work together. At the end of the presentation, I discuss how to -work- as a Web developer.

The presentation included three live demonstrations, not detailed in the slides.

Transcript

1. LARRY ULLMAN @LARRYULLMAN, WWW.LARRYULLMAN.COM BOSTON PHP DECEMBER 12, 2012 HOW TO BECOME A WEB DEVELOPER Hello and welcome to “How to Become a Web Developer”. My sincerest thanks to everyone for coming out tonight, and to Boston PHP for having me.
2. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 ABOUT ME When I do presentations, I don’t normally talk so much about myself. But most of the information I’m sharing with you today comes from personal experience. To start way back when, I have a degree in English literature, with a minor in Philosophy and Religion. I took 2 years of Latin in college. I pretty much avoided anything useful. And, I’ve been a Web developer for 13 years now. If I can do it, based upon that background, so can you. Now, to be clear, I have very little foresight on what the future looks like, and only a smattering of insight on where things are today. But I’ve got excellent hindsight, and that’s what I can share with you. My hindsight can be your foresight. Here’s an example: [[STORY: WWW in 1994]]. Again: foresight not so much, but in hindsight I’ve been able to figure out that this World Wide Web thing might just be going somewhere. So how do you become a Web developer, just in case the WWW does have a future?
3. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 PRESENTATION 1. GETTING STARTED 2. CORE CONCEPTS 3. THE YII FRAMEWORK 4. GETTING WORK Tonight, over the next hour or so, I’m going to tell you everything you need to know to become a Web developer. Which is a lot like saying I’m going to show you everything on Earth by presenting a globe. No, the information will be on a macro scale, but you’ll find out what you need to learn and in what logical order. The order is not cut and dry in terms of beginner, intermediate, advanced, so much as a logical progression over time. You’ll need to learn this, before you learn that. At the very least, this is because what’s intermediate for one person is advanced for another. [[GO THROUGH THE LIST]] I’ll spend approximately 15 minutes on each topic. Now there’s a range of experience here tonight, so if I’ve done my job right, some of you will be bored early on, some of you will be lost later on, but everyone should learn a few things. Also, I thought that just presenting a list of technologies and topics is the kind of thing you can find online and that you’re not likely to remember today anyway. So I’m going to mention lots of stuff tonight, and plenty of resources, but I’ll put together a page online with all these for you to refer to later. Just head to LarryUllman.com this weekend or next week and you’ll find it there, along with these presentation slides, of course. So in this presentation I’ll provide an overview of being a Web developer, but I’m also going to stress some key points along the way. Just to make things interesting, I’m going to do a fair amount live on my computer tonight. That introduces the potential for colossal and public failure on my part.
4. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 BIG PICTURE HTML CSS JAVASCRIPT DATA PRESENTATION INTERACTION WEB PAGE SERVER PHP MYSQL WEB SERVICES Admittedly, I can’t reasonably teach you everything you need to know tonight, but I can provide an understanding of the big picture and how the pieces fit into that. And that’s really very simple: [[WALK THROUGH]] Stress client side vs. server side.
5. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 WHERE TO BEGIN? So, you want to become a Web developer: where do you think you should start? [[HANDLE ANSWERS]] Those are all very good guesses, but my answer tonight is that you should begin by learning about
6. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 Yourself. I’m not a self-help guru, but when I think about what people should do to become a Web developer, I think you should start by looking inward.
7. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 YOU • STRENGTHS & WEAKNESSES • WHAT YOU LIKE & DON’T LIKE What is it that you are good at? What aren’t you good at? What do you like to do? What don’t you like to do? Keep in mind that sometimes you’re going to have to do things you’re not good at or that you don’t like. And that’s actually for the best. But whatever your answers are, simply answering these questions will help you plan and spend your time wisely.
8. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 CONDITIONS “I NEVER TEACH MY PUPILS; I ONLY ATTEMPT TO PROVIDE THE CONDITIONS IN WHICH THEY CAN LEARN.” --ALBERT EINSTEIN Throughout the rest of the presentation I’ll talk about the many things you should learn, but you also to learn how to learn. As I said, I majored in impractical education. But I learned how to learn. I learned how to absorb information, synthesize it, use it, and, if need be, restate it. [[QUOTE]] You need to provide your own conditions. Furthermore, the most important piece of advice I have for you tonight is this: never stop learning!
9. LARRY ULLMAN @LARRYULLMAN BOSTON PHP DECEMBER 12, 2012 HOW TO BECOME A WEB DEVELOPER In fact, the title of this presentation shouldn’t be how to “become” a web developer, because it’s not a matter of learning this, that, and the other and you’re there. No, it should be called “how to be a web developer”. It’s an active thing you do. I’m certain this is true for many careers, but it’s so applicable to computers. Many of the things I know didn’t exist 5 years ago. People ask kids what they want to be when they grow up? Well, personal computers didn’t exist when I was a kid, so how could I know this is who I’d become?
10. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 HOW TO LEARN • LEARN HOW TO ASK QUESTIONS • LEARN TO BE OKAY WITH SAYING “I DON’T KNOW.” • BE A FOLLOWER UNTIL YOU CAN BE A LEADER So how do you provide your own conditions? How do you learn new things? I’m not talking about resources here, but a mindset. First, you need to learn how to ask questions, especially with the Internet, where you can get free help from strangers, but also be berated because you top posted when you should have bottom posted. There’s a classic Web page titled “How to Ask Questions the Smart Way” which I’ll include in my page of resources. Next, you need to be okay with saying “I don’t know”. A hallmark of a professional is being aware of what they don’t know. By admitting that you don’t know something, you put yourself in a position to learn. And finally, be a follower until you can be a leader. That’s a bit hokey, but it’s flows nicely. Get on Twitter, Get on Facebook, get on that Google thing. Follow people of note. Don’t ask them questions, don’t interact, just watch what they’re up to. [[STORY: MOBILE WEB DEVELOPMENT CONFERENCE]] Subscribe to newsletters, lots of them. Use Prismatic or StumbleUpon and other tools for finding recommendations. Use Stack Overflow and Quora. In short, overwhelm yourself with input.
11. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 HOW TO LEARN And because you’ve overwhelmed yourself, you need a plan. You’ve got all this stuff coming in through your browser, your email, Twitter, etc., and you’re not going to read it immediately. So you need a plan. Find a tool you like for managing things to read later. Instapaper or Pocket or whatever. Then, and this is important, set aside time each week to actually read these things. I make it a todo list item. Finally, be sure you’re taking notes and bookmarking or otherwise storing the resources you’ve read so you don’t have to hunt them down later.
12. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 WHAT TO LEARN One last thought about learning...this is the Pragmatic Programmer, is a classic book. How many people here have read it? I will say that a lot of its content will be beyond the beginner and even the intermediate developer. But you should read it eventually. I’m mentioning it now because it presents the very interesting idea of managing your intellectual portfolio. Your knowledge is a resource that’s vital to your job. If I stop learning today, I’ll be irrelevant in two years. The same is true for you. You should attend to your intellectual portfolio as you would your retirement portfolio. This means that you need to constantly put new knowledge into it. But the more interesting idea is that you should also balance how you invest your knowledge. Spend a little bit of time learning something that’s riskier, that may not be useful, because it could pay off big. But spend most of your time learning something that’s guaranteed to be useful. Manage your intellectual portfolio.
13. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 0. KNOW THYSELF 1. GETTING STARTED 2. CORE CONCEPTS 3. THE YII FRAMEWORK 4. GETTING WORK PRESENTATION To start being a Web developer then, first know thyself.
14. 1 GETTING STARTED “COMPUTERS ARE INCREDIBLY FAST, ACCURATE, AND STUPID. HUMAN BEINGS ARE INCREDIBLY SLOW, INACCURATE, AND BRILLIANT. TOGETHER THEY ARE POWERFUL BEYOND IMAGINATION.” --ALBERT EINSTEIN Okay, so you’ve thought about who you are, what your strengths and weaknesses are, what you like, what you don’t like, and how you best learn. Let’s get into the actual technologies. What’s first?
15. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 Backup system. Seriously. I’m not talking about version control, I’m talking about frequent, reliable, offsite backups of your most important work. We all know we should do it, but many of us don’t. Start today. But then...
16. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 BIG PICTURE HTML CSS JAVASCRIPT DATA PRESENTATION INTERACTION WEB PAGE Earlier I showed this slide which shows the three main parts of a Web page. There’s also media, such as images and videos and such. The first thing you must learn are these components. In decreasing order of importance, that’s HTML, CSS, and JavaScript. HTML is the one ring to rule them all. If you’re a Web developer, there will never be anything more important than HTML. There will be more useful and valuable technologies, sure, but without HTML, there’s no Web. I’m not going to talk about JavaScript quite so much tonight, but that’s not because I love it any less. It’s just harder to demonstrate and appreciate in a short time period.
17. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 TOOLS You’ll need a few tools in order to develop Web pages. I’m thinking of three categories in particular. - Browsers, for testing your site - Text editor or IDE, for creating you site - A graphical application for basic image manipulation. Crop. Change sizes. Change formats. Photoshop or a cheaper alternative
18. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 {LIVE} So let’s play a little bit here...
19. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 BIG PICTURE HTML CSS JAVASCRIPT DATA PRESENTATION INTERACTION WEB PAGE SERVER PHP MYSQL Now, you’ve created a static Web page, which is great. But static pages really aren’t manageable over the long run and they don’t provide the functionality expected by today’s users. You need to learn how to create a dynamic Web site. Doing that requires use of a server side technology. My technology of choice tends to be PHP, but you can use ASP.NET or ColdFusion or Ruby or Python or whatever.
20. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 {LIVE} Let’s take our static page and make it dynamic.
21. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 0. KNOW THYSELF 1. GETTING STARTED 2. CORE CONCEPTS 3. THE YII FRAMEWORK 4. GETTING WORK PRESENTATION To get started being a Web developer then, you have to learn how to create static Web sites using HTML et al. Then you can begin creating dynamic Web sites using PHP and MySQL.
22. 2 CORE CONCEPTS "THE MAJOR DIFFERENCE BETWEEN A THING THAT MIGHT GO WRONG AND A THING THAT CANNOT POSSIBLY GO WRONG IS THAT WHEN A THING THAT CANNOT POSSIBLY GO WRONG GOES WRONG IT USUALLY TURNS OUT TO BE IMPOSSIBLE TO GET AT AND REPAIR." --DOUGLAS ADAMS
23. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 CORE CONCEPTS • LANGUAGES • SECURITY • IDEAS • TOOLS
24. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 LANGUAGES • MASTER PROCEDURAL PHP • START LEARNING OOP • MORE SQL & MYSQL • REAL JAVASCRIPT http://jsbooks.revolunet.com/
25. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 SECURITY LESS MORE EASIER CHEAPER FASTER HARDER COSTLIER SLOWER Know that security is not a binary state! [[Car metaphor]] Match the level of security to the application.
26. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 PERCEIVED ACTUAL SECURITY [[EXAMPLE: SSL CERTIFICATE]]
27. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 INPUT VALIDATE ESCAPE OUTPUT USER PHP PHP HTML SECURITY validate input/escape output prevents most attacks never trust user input
28. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 IDEAS • AJAX • WEB SERVICES • ALTERNATIVE DATA FORMATS AND STORAGE How does a site function without an input device? Section 508 How does it function with JavaScript disabled?
29. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 E-COMMERCE e-commerce: not for beginners; must use SSL; payment gateways
30. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 DEBUGGING • XDEBUG • RUBBER DUCK DEBUGGING • HANDLING ERRORS GRACEFULLY
31. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 TOOLS • MASTER YOUR TEXT EDITOR OR IDE • MASTER BROWSER DEV TOOLS • SERVER BASICS • COMMAND LINE • JAVASCRIPT FRAMEWORK OR TWO • PHP FRAMEWORK OR TWO Server basics include: .htaccess files, mod_rewrite, etc. Maybe also another database
32. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 0. KNOW THYSELF 1. GETTING STARTED 2. CORE CONCEPTS 3. THE YII FRAMEWORK 4. GETTING WORK PRESENTATION To really become a Web developer then, you have to learn several core concepts. Not just about mastering the technologies, but also about learning how to use them in different ways.
33. 3 THE YII FRAMEWORK
34. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 REASONS TO LIKE YII • ACCESSIBLE • LET’S YOU BE LAZY! • SCALES WELL • JQUERY BUILT IN Flexibility: swap ORM, db library, template library (e.g., to Twig), etc. Works well with third-party software Great for beginners, and fine for advanced programmers, too.
35. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 GOODIES • BUILT-IN AUTHENTICATION & AUTHORIZATION • WIDGETS & EXTENSIONS • THIRD-PARTY LIBRARIES • CACHING You can also do auth via OpenID LDAP, Twitter, Facebook by extending CUserIdentity Widgets put complex pieces into HTML. Self-contained unit, like a complete Yii application within the application (but cannot be used on its own) Examples: admin, forum, store
36. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 MORE GOODIES • INTERNATIONALIZATION • TESTING • CONSOLE APPLICATIONS • WEB SERVICES Can store single piece of data, pages or page fragments, or database stuff. l18n: message translation, date, time, & number formatting
37. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 0. KNOW THYSELF 1. GETTING STARTED 2. CORE CONCEPTS 3. THE YII FRAMEWORK 4. GETTING WORK PRESENTATION And that’s a quick introduction to the Yii framework. As a Web developer, you need to know a couple of PHP frameworks, perhaps Yii might be one of them.
38. 4 GETTING WORK “A PROFESSIONAL IS SOMEONE WHO CAN DO HIS BEST WORK WHEN HE DOESN'T FEEL LIKE IT.” --ALISTAIR COOKE [[MY STORY ABOUT LOW INCOME HOUSING AND GETTING STARTED]]
39. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 GETTING WORK • CREATING A BUSINESS PLAN • DEVELOPING SKILLS • ACQUIRING TOOLS • HOW TO GET CLIENTS • WORKING WITH CLIENTS So let’s walk through getting work. I’ve got five relatively short subtopics. [[WALK THROUGH]]
40. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 EMPLOYMENT First, though, I need to clarify what I’m talking about here. There are two general paths I could be discussing. One is being employed as a Web developer, in other words: working for someone else. It could be a clear technology company, a university, or just a business. This, admittedly, is not my area of expertise, but I should at least try to address it. Really, it’s a three-step process. First, find out what employers want. These is easily done using job ads and descriptions online. Second, make sure you fit those criteria. Ironically, I could have a hard time getting a tech job with many employers because I don’t have a computer science degree. Third, get a foot in the door somehow. You can get a foot in the door via internships or by starting in another department. [[GEORGETOWN]] For the rest of the presentation, I’ll specifically address working for yourself as a Web developer. It doesn’t matter whether it’s your primary job, or a part-time gig.
41. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 LOGISTICS SIGNS OF FAILURE GOALS FOR SUCCESS BUSINESS PLAN You need to come up with a business plan. I say this as a person that never did. I’ve been working for myself since 1999, and literally just this year have I taken certain steps I should have taken years ago. So be smarter about that than I was. The main point of the business plan is to identify your goals so that you can think of how you will get there. The business plan does not have to be too detailed or in stone. Just figure out who you want to be and fake it until you make it. Also, vision boards. I also think you should prepare for failure as part of your business plan. Not that you will fail, but just as you want to identify what success means, you should identify the circumstances for throwing in the towel. Failure includes clients not paying. You need to figure out how to cope with that. Finally, think about the logistics. For example, how much money do you need to be making? What will your expenses be? For how long can you afford those expenses? What kind of marketing are you going to do? Plan on doing more marketing than you’d care for. Who is going to do the accounting? The payroll? Consider targeting specific business types (lawyers, doctors, etc.) or platforms (WordPress, Joomla, etc.). Consider working with others.
42. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 COMMUNICATE DEMONSTRATE SKILLS OUTSOURCE WEAKNESSES DEVELOPING SKILLS http://www.flickr.com/photos/ 64379474@N00/5264881890/ KEEP YOUR PROMISES “WE ARE WHAT WE REPEATEDLY DO; EXCELLENCE, THEN, IS NOT AN ACT BUT A HABIT.” --ARISTOTLE There are four key skills I think you need to master. The first, and by far the most important, is the ability to communicate. Learn how to communicate effectively. You don’t have to be profound, but you must be comprehendible, honest, and punctual. Comprehendible, honest, and punctual. There is nothing more important. The next two skills are related. One is that you must learn how to demonstrate and accentuate your skills. You are going to be a salesperson, whether you like it or not. Similarly, learn how to outsource your weaknesses and dislikes. This goes back to what I said when we first started. Once you know yourself, use that knowledge to your advantage. Spend your time wisely. Finally, keep your promises. Do what you say you’re going to do. If you’re going to miss a deadline, be honest and open with the customer. Many people hide when they’re behind schedule, which is the exact opposite thing to do. And it makes customers furious.
43. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 GREAT HOSTING & SERVICES GOOD SOFTWARE & HARDWARE DON’T SPEND MONEY ACQUIRING TOOLS OUTSOURCE Here’s a great fact: unlike architects or doctors, you can be a Web developer without putting in much time or money. You don’t have to go to medical school, you don’t have to find someone to actually build the house you designed. I’ve developed many Web sites on this laptop. In all likelihood, the computer you have already is fine. If you’re dealing with open source technologies, such as Apache, PHP, and MySQL, those are all free. So, when you’re just starting, try not to spend any money. Honestly, you can start a Web business for a couple hundred dollars. That’s it. Eventually, buy good software, like a good IDE. Eventually, buy great hosting. Generally, though, spend money on the things you’d rather not do or are not a good use of your time. For me, that’s design and accounting.
44. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 ONLINE SITES FRIENDS & FAMILY YOU GETTING CLIENTS USER GROUPS So how do you get clients? That’s the big question. One solution I’ve found is to write books, but that’s not the most practical solution for everyone. My first piece of advice is to be your own client! Come up with an idea and implement it. Maybe you’ll make money this way, maybe you won’t. But you’ll gain experience, which is more important early on. There’s a woman by the name of Amy Hoy that teaches a class called 30x500. The class teaches you how to create and develop your own business. The premise is that too many people want to create the next Facebook, which isn’t feasible. But if you can create a site or service that 500 people are willing to pay $30/month for, you’re now bringing in $180,000 a year. Not bad. By the way, Ms. Hoy charges about 3 grand for that class. Similarly, use your friends and family as clients. You probably can’t charge, or can only charge a nominal amount, but again, you’ll build up experience and a portfolio. Finally, use some of the online sites for getting work. You won’t get great jobs from these sites and you won’t get rich, but you can make money this way. The general advice I have is: Early on, you’re going to have to literally or figuratively give it away. It sucks, but it’s true. Two stories: [ME AND CHARLIE] [The Yii BOOK] I should also add that you want to make sure you’re using contracts with clients. It’s an easy step to skip, but you really shouldn’t. Any other suggestions anyone has?
45. LARRY ULLMAN HOW TO BECOME A WEB DEVELOPER 12|12|2012 THINK ABOUT THE FUTURE GIVE MORE COMMUNICATE WORKING WITH CLIENTS Finally, and I do mean finally, let’s speak a couple minutes about working with clients. I have three pieces of advice for you here. First, communicate. Be comprehendible, honest, and punctual. Reread your emails before you send them. Be forthright and informative. Second, give the customer more than they were expecting. Always. You don’t have to do a big extra thing, just something. Third, and this is related, think about this client as a potential future clients. Too many businesses focus on getting new customers when it’s much easier to retain existing ones. That client I mentioned here in Boston that I did the JavaScript work for years ago: he’s still a client, and last year I finished another decent sized project for him.
46. LARRY ULLMAN @LARRYULLMAN BOSTON PHP DECEMBER 12, 2012 HOW TO BECOME A WEB DEVELOPER And that is how you become, I mean BE, a Web developer. Thank you.