Development

Tips for New & Aspiring Web Developers

By January 14, 2016 No Comments

Web development can be a challenging field. For new and aspiring developers, it is easy to feel overwhelmed. It can be difficult at times to even know where to start and what to learn. In this post I will share some strategies that have helped me to continue learning as a web developer and I will describe some of the technology stacks and tools relevant to web development today.

Since the field of web development is so broad I find it helpful to structure my learning around building projects. These can be projects from work or projects based on one of your own ideas. The project can be big or small, the most important thing it that the process of building it will be enjoyable and interesting to you. I think this is the best approach for several reasons.

  • You will be intrinsically more motivated and more mentally involved.
  • You will develop a more meaningful and powerful kind of problem solving ability by engaging in real development.
  • Your project will provide you with a natural learning path that will evolve with your skills and continue to challenge you.
  • You will have tangible work to show for your efforts

As a beginner, don’t get overwhelmed upfront by the amounts of different technologies, frameworks, libraries, programming patterns etc. Start simple. Even just using basic functions can take you very far. Don’t worry about incorporating everything upfront and being the perfect developer. Start building your project and you will naturally get introduced to the more advanced tools and concepts that are relevant to you and what you are working on.

What skills and knowledge are important to becoming a web developer?

For a complete beginner I would recommend starting out by learning HTML, CSS and JavaScript.

There’s no setup involved here. You can just open any text editor and start writing HTML, CSS and JavaScript code and open these files up in your web browser. Get a simple text editor that will help you out with the syntax. Notepad++ or Sublime Text are good options that you can start using for free.

HTML, CSS and JavaScript are ubiquitous in modern web development. Do some searching and find some resources that fit your learning style. Once you have solved a few problems and start to feel somewhat confident this is a good place to start building your project. Focus on what you can do right now, pick a part of your project and make some basic webpages for it. Create the layout and add a little bit of interactivity using JavaScript. Figure out how to use your browser’s page inspector to play around with the layout and styling. Learn how to use your browser’s JavaScript console to debug and interact with your JavaScript files. At this point I would also recommend taking a look at JQuery as your first library and try incorporating it into your project.

After you have some experience it’s probably time to start branching out into server side development and databases. Maybe you are thinking that you just want to focus on HTML, CSS and JavaScript. As tools become more efficient, developers are expected to be able to do more. This means being able to work across multiple areas of web development from the front end to back end to database. Even if you don’t end up working with everything described here day to day, nowadays it is extremely helpful to have a more encompassing understanding.

Before just diving in I would suggest taking a step back to look at the larger picture. Read a little about what a server actually is and how it works. Get an idea about front end / client side vs back end / server side. Get a basic idea about http and the request, response cycle. Get a basic idea about where the database fits into all of this and how the server and database interact. Take a look at some fundamental database concepts like SQL vs NoSQL. Take a look at the widely used databases like PostgreSQL, MySQL, MongoDB, Couch DB etc. and get a basic understanding of how they work and how they differ.

You won’t understand everything. Keep your questions in mind as you continue building your project. Address these questions as you go.

There are a lot of different options and possible paths you could take at this point. I will describe three different paths based on technology stacks that are each very relevant today and that I find to be the most ‘developer friendly.’ By this I mean they each are comparatively easy to learn and have a lot of good resources available.

The Ruby / Rails Pathway

  • Figure out to set up the ruby language on your machine
  • Print hello world in ruby, write some basic ruby programs
  • Create a simple webserver using Webrick or the socket module.
  • Learn the Rails framework, make a rails project and incorporate a database. With Rails a SQL database will probably be easiest, you could use MySQL or PostgreSQL.
  • Learn some basic system administration.  Set up your own servers, set up your own domain address and host your project! You can set up your severs using Digital Ocean, they have lots of helpful guides, tutorials and tools.

The Python/Django Pathway

• Get python and set it up on your machine

• Print hello world in Python, write some basic python programs

• Create a simple python http server using the simpleHTTP server module

• Learn the Django framework, and incorporate a database. With Django a SQL database will probably be easier, you could use MySQL or PostgreSQL.

• Learn some basic system administration.  Set up your own server, set up your own domain address and host your project! You can set up you severs using Digital Ocean, they have lots of helpful guides, tutorials and tools.

The Node/Express Pathway

• Set up node on your machine.

• Print hello world in node, write some basic JavaScript programs, run them using node.

• Use node to set up a basic http server on your local machine

• Learn express.js and experiment with different node packages and the node package manager. Integrate a database into your application. A NoSQL database like Mongo DB or Couch DB will probably be the easier options.

• Learn some basic system administration.  Set up your own server, set up your own domain address and host your project! You can set up your severs using Digital Ocean, they have lots of helpful guides, tutorials and tools.

Which one should I choose?

It’s not really all that important. Start off learning one, you will probably get some exposure to the others at some point. Whichever you choose, you will start to learn lots of cross compatible skills and concepts. With the Node/Express pathway you get to stick with JavaScript and don’t need to learn another language. Since you will already have some experience with JavaScript the Node/Express pathway will probably be the easiest to get started with although you will need to get a feel for asynchronous programming which can be a tricky concept to grasp. Ruby/Rails and Python/Django will have more new material to learn upfront but afterwards things will start to feel easier and progress more smoothly. There will be less work and configuration needed later on and more available libraries and modules available since both Django and Rails are more developed than Node/Express which are relatively new.

At this point you could also start exploring…

 

  • Some testing tools like RSpec for Ruby on Rails,
  • CSS frameworks such as Bootstrap.

 

As you continue building your project don’t be afraid to go back and refactor parts of your application. As you encounter problems use these as a way to introduce yourself to new concepts and tools. Start getting a feel for the intricacies of whichever framework you chose and start learning about some common programming and development patterns to organize your code and streamline your development practices.

Some Additional Tips

Intersperse your project learning with conceptual “deep dives.” For example, maybe you see some ruby code and are confused by the line

require “mymodule.rb.”

Take some time to read about ruby classes, modules, mix-ins etc. Get a good understanding and if possible, write out your own program that demonstrates the concept.

If you get stuck on an idea and aren’t sure how to represent or implement the idea in your application, take some time away from your code to think about the underlying problem. Whenever possible try to break the problem up into smaller, more manageable steps.

If you feel like you have a good idea about how to implement something but are having a hard time representing it with a particular language, framework or tool, take some time to read the related documentation.

Try to understand the concepts behind a new module, library or tool before you start using it. If you understand the problem it is trying to solve and a little bit about how it works then you will find it to be very powerful and convenient. Otherwise it will be frustrating to work with and seem unnecessarily complicated. Sometimes it can be very helpful to first try implementing your own basic solution to the problem first.

Spend some time working as a professional web developer. There are many unique challenges associated with creating production level code and applications as part of a team.

As you continue to advance as a web developer try to stay up to date with new technologies. Keep the project learning mindset but start experiment with more complicated projects. Check out some MVC/MV/etc. JavaScript frameworks like angular or react. Find the area of web development you are most passionate about, start to specialize a bit more but stay well rounded. Find and participate in developer communities and meet ups. Contribute to open source projects. Continue learning and maintain your enthusiasm and enjoyment as a developer!

Web Application Startup Guide

A 30-page ebook that covers positioning, marketing, pricing, and building your startup product, plus more.

Leave a Reply