essay on web development

My journey to becoming a web developer from scratch without a CS degree (and what I learned from…

By Sergei Garcia

First, let me introduce myself. My name is Sergei Garcia, and I’m a full-time front end developer with 2 years experience. In that time, I’ve worked as a front-end developer for both a Forbes 500 consulting firm and a small company.

This may not sound like a lot of experience, but finishing my second year as a developer has been a huge milestone for me. This is because I had no real experience doing web development — and not much programming experience in general beyond some basic C# and Java training I got from a few online courses. I also didn’t have a computer science degree since I graduated with a degree in IT project management.

I’d never written about my experience despite all the help I’ve received from wonderful resources like Medium, Stack Overflow, and Reddit’s programming subreddits. So today, I decided to change that. Today I’m going to fill you in on what went right, and what didn’t, so that if you’re embarking on this journey, you’ll have better luck than I did.

I know that there are a lot of articles like this, but not very many of them discuss the process with the benefit of an extra two years of hindsight.

I’ll start off with my journey, including what went wrong along the way. If you just care about what my suggestions for the shortest possible route to becoming a web developer from scratch are, feel free to skip to the last section: The shortest route .

So, without any further ado, Let’s get started!

Getting the Basics

After deciding I wanted to get into web development the first question on my mind was “What do I learn?” After doing some research, I ended up making my learning path based on what most entry-level web developer positions asked for, which was:

HTML & CSS

• CSS Preprocessors (Less & Sass)

Responsive Design

Design patterns.

• Task Runners

Here’s how it went.

I began my Journey learning JavaScript through CodeSchool (paid) and Codecademy (free). If you don’t know about these, they’re great websites that allow you to learn to code by coding inside the browser.

I found learning resources like this were the best when you are just getting started. Just be advised that this method of learning gets tiring quickly once you get into more advanced stuff, since their algorithms for checking whether you solved the code example correctly have some accuracy issues. Both of their introductory courses to JavaScript were outstanding and I highly recommend them.

Once I got the basics out of the way, I proceeded to get a stronger JavaScript foundation by reading the Eloquent Javascript: A Modern Introduction to Programming book by Haverbeke (free).

This book was recommended to me by a lot of people in the JavaScript forums as a must read, and for good reason. That book was tough — especially if you’re just learning programming like I was back then. But I’m glad I didn’t give up and kept at it. It was phenomenal due to the vast scope of programming concepts it covers, even if it was a bit ruthless at times. Whatever you do, don’t skip the code challenges. Once you finish this book, then you can finally say with confidence that you have a good grasp on JavaScript.

You can also optionally learn jQuery (though I really don’t recommend learning it yet — more on this later). You can learn it through CodeSchool’s Try jQuery course.

After learning JavaScript, I proceeded to learn the fundamentals of HTML & CSS and web design through CodeSchool’s HTML & CSS learning path . These courses are still my favorites today, since the pacing is great, and the overall scope of what they cover allowed me to acquire a stronger foundation to this.

You could also switch this out easily for something like Codecademy’s HTML & CSS course and still get similar results. Or if you are up for a challenge, Udacity’s course Intro to HTML and CSS is far more complete, and slightly more challenging.

Bonus : If you can get your hands on Jon Duckett’s HTML and CSS: Design and Build Websites book, it’s also a rock solid starting point for learning HTML & CSS (with a sprinkle of web design). It’s highly rated (4.7/5 on Amazon), offers a solid introduction to the world of web development. It’s a beautiful book thanks to it’s clean design with big letters and colorful pages. I often come back to it just to admire it.

Less / Sass

For those unfamiliar, Less & Sass are CSS transpilers that allow you to write CSS in a more elegant manner. This lets you do things that aren’t normally supported, like nesting CSS rules. Once finished, these CSS transpilers “compile” your code and convert it to normal CSS.

There are 2 major CSS transpilers right now: Less and Sass . Sass is the more popular one, but I found learning Less first to be easier, mainly because using Sass on your computer requires also installing Ruby, which I wasn’t fond of.

You can get a quick, yet complete overview of Less using WinLess’s Online Less Compiler and it’s code examples to see how your Less code would turn into CSS. You can also try Sass online using SassMeister (though this doesn’t include code examples).

It doesn’t matter whether you learn Less or Sass first. They’re extremely similar, so once you know one, you pretty much know the other. You can find a great quick comparison between Less and Sass on Shelby Moulden’s article Comparison between LESS & SASS .

I originally learned about responsive design and Bootstrap using Codeschool’s HTML & CSS path, but I recently found Udacity’s course by Google on Responsive Web Design Fundamentals to be fantastic at covering the basics and beyond in a far more complete manner than Codeschool did.

You can do responsive design without any additional framework, but it’s far easier with the help of a responsive framework like Bootstrap. Bootstrap’s official documentation is very well made so you should have no problem at getting started with it.

If you are having trouble grasping it’s basic principles, read Froont’s blog post on 9 basic principles of responsive web design . It has beautiful clean & simple animations that help illustrate visually the principles of responsive web design.

I didn’t really know what exactly AngularJS was back then, but I knew everyone was talking about it, and that if I wanted to become a web developer I needed to learn it. I found Google Developer’s Design Decisions in AngularJS to provide the best general overview of what AngularJS was and how it improved making web applications.

I first thought of learning AngularJS through their official documentation, but this turned out to be a terrible idea. The documentation wasn’t very easy on beginners, and the cluttered formatting made it hard to read and understand.

I then proceeded to learn AngularJS through Codeschool. With my positive experience on the JavaScript and CSS courses also from there, I expected nothing less than a great course. I was wrong. The course was a disaster from the get go, since the algorithm used to check if you got the code example right sometimes didn’t work right and marked your clearly right solution as incorrect. There were even times where all it took to fix the broken validation system was a page refresh. As for the course’s content, it wasn’t great either. It did an ok job at explaining the basic components of an AngularJS application, but it did a terrible job at integrating these into a real application, leaving me with far more questions than I started with.

After some searching around forums, I stumbled upon Egghead.io (free / paid) where I had much better luck. Their course material was a lot cleaner, more concise, and more complete, making for a far better experience. Not to mention that apart from their courses, they have bite-sized 2–5 minute lessons that cover important topics. (For example: What is a controller? What is a filter? What is $scope?) These make it really easy to understand the basics. They also have some videos that require payment, but they are usually the ones covering more advanced angular topics you will not need until later on. I took their AngularJS Fundamentals course and I was fully satisfied with the results (and also became a big fan of Egghead.io’s courses in the process).

Design patterns are basically reusable code solutions that can be repeatedly used to solve common software problems. Having a foundation on this will make you far more competitive software developer in any programming language. This will also make it easier for you to understand other people’s code, since you’ll quickly identify what design pattern they used on their code to better understand it.

I found the 2 best sources to learn this are doFactory’s JavaScript Design Patterns and Addy Osmani’s Learning JavaScript Design Patterns . I found doFactory a lot easier to understand, while Addy Osmani’s book was a lot more complete.

Chrome DevTools

Chrome is one of the most powerful tools for a web developer. The sooner you master it, the more time you can save later on. Codeschool’s free course Explore and Master Chrome DevTools does a great job at introducing them.

Git (Version Control)

Ah, Git — the tool I never knew I needed until I discovered what it could do. Git basically it lets you keep a track of the changes you make to your code so that if things go wrong, you can roll back to a previous point in time. It also lets you see your code’s history.

I found CodeSchool’s free Try Github course to be a friendly way to get started. Atlassian’s Git training was superb at covering the more advanced commands available. Codeschool’s Git Learning Path is also great at covering Git’s fundamentals.

It didn’t take long before I learned that having a basic understanding of NodeJS would help me greatly in my quest of becoming a web developer (more on this soon).

I tried Codeschool’s courses on Node, but I found them really lacking in content. I found NodeSchool.io to be a far better teacher at getting the basics right, and it was fun! I loved the hands-on approach it offered, which was similar to Codeschool and Codecademy — with the added improvement that I was really running NodeJS.

Task Runners (Grunt & Gulp)

Grunt and Gulp were quite a big surprise to me in that I had no idea tools like that even existed — but I’m extremely glad they do! Basically, these task runners allow you to automate common tasks. For example, remember Less/Sass? Normally you would have to manually run the CSS compiler every time you make an edit for it to compile the CSS, and then update the browser. Using a task runner, you can set it up to watch your Less/Sass files for changes, and when it detects a change, compile your CSS, and automatically refresh the browser. This is immensely useful at reducing your development time.

There are 2 main task runners right now: Grunt and Gulp. While they do the exact same thing, they work in very different ways, with Grunt being a lot more verbose and configuration oriented, and Gulp being shorter to write and preferring code over configuration.

Knowing NodeJS will help you write better Grunt and Gulp files since both of them run on NodeJS . You can pick whichever you want, but I found Gulp to be far easier to learn and write. I still today prefer it because of its minimalist — yet powerful — pipe-based approach.

I found Scotch.io’s courses on Grunt and Gulp to be among the best out there.

Challenges I faced on my first job

Once I covered the fundamentals of web development, I was ready for my first web development interview for an entry level position. I won’t go into details about the interview since this isn’t this article’s main focus. But I will say that I was told my relatively strong JavaScript knowledge help me secure the position. (Thanks, Eloquent JavaScript!)

I have to say, I was quite nervous on my first project. It involved making reusable web components with HTML, CSS and JavaScript, along with Bootstrap, Sass, Grunt as tooling. T

he two biggest mistakes I found at first were:

• Fear of failure. Because I was the new guy, I was constantly in fear of my code being wrong or poorly made, so I spent a lot of time double-checking everything and adhered to coding best practices. Because of this, I rarely attempted solutions in creative new ways because of my fear that it might not work correctly at the end. This effectively shut down my drive to learn new things.
• Doing things because “X” person who knows better than me said so. I did this a lot at first. While not completely wrong, doing things in a certain way only because “X” expert on the matter said so — without knowing why — lead to me not really knowing when to why things were done the way they were. I soon learned that there were exceptions to everything, and that you always should know the reason behind best practices.

Thankfully, I had an understanding team lead during my first project who helped me overcome these issues. He constantly motivated me to try new things, even if things went wrong sometimes. He also told me to question everything — even his teachings.

In time, I learnt my lesson. From then on, I’ve always been a person that looks forward to trying new things. I always try to understand why best practices exist, when they’re right, and when they don’t apply to a situation.

Using AngularJS in an actual project also posed quite a big challenge for me. This was mainly because a lot of the things I did with it, I did without fully understanding why they happened. I thought of it as “angular magic.”

There were many times that I wished I knew how Angular actually worked, but it was scary looking at the documentation.

I eventually stumbled upon an amazing book called Build Your Own AngularJS . I didn’t read all of it, but reading the section on Scopes and Watchers and how they worked really unveiled how the magic behind angular, wasn’t really magic. It was just a clever way of maintaining data-binding using dirty checking and nested scopes. I highly recommend this book to anyone seeking to fully understand AngularJS.

The other challenge I faced a year later was how fast web development progressed. I had just mastered AngularJS and Grunt, and was feeling all proud and mighty — only to soon find out Gulp and ReactJS were on the horizon. And a year later after learning them, Webpack started gaining ground, and I had to learn that too. As you can imagine, a big part of me was pretty disappointed with how quickly some of my knowledge became obsolete. But a coworker soon enlightened me by telling me something that changed how I viewed libraries and frameworks forever:

“Libraries and Frameworks may become obsolete, but the concepts and solutions they propose often survive the test of time.”

He was right. AngularJS may have become obsolete, but fully understanding the magic behind it helped me better understand React’s web component architecture, which improved upon Angular’s Directives concept. It also helped me understand how ReactJS gained so much popularity, as well as what kind of future awaited.

I don’t recall facing any other major challenges on my subsequent projects. But what I will say is that over the course of the 2 years I’ve been doing web development, the #1 thing that has helped succeed (according to my own coworkers) was my excitement and my powerful drive to always be on the lookout for new things to learn. I soon found out this was a winning combination with web development since things over here change really, really fast, with new frameworks and libraries constantly emerging.

On the flip side of the coin, the other thing that helped me a ton — and something I found out quite recently actually — was understanding what not to learn. This became critical to my process of becoming a better web developer.

It’s not uncommon to see people criticizing the abnormally fast pace of evolution of web technologies, or how a new JavaScript library or framework comes out nearly every day. But in time I saw the light and finally understood:

You don’t have to learn every new library or framework that comes out.

Often it’s a great idea to do a simple hello world example app so you can see what a framework offers. Then you can move on. But usually, you should try to focus on what best suits your project’s needs. This can be hard at first, but thankfully great places like Stack Overflow, Medium and Reddit exist where you can find useful discussions between frameworks, and figure out which ones fit your specific use cases the best.

Going Further

In the upcoming years, I proceeded to continuously improve in the following ways

Once you finish Eloquent JavaScript, it’s rather easy to say and feel like you’ve mastered JavaScript, but then comes You Don’t Know JS and it absolutely destroys you (or at least it did to me). This book series (free by the way) was mentioned to me several times by a few senior web developers in the office as the book to read, and that only until I’ve read it can I say I fully know JavaScript. They were right, since page after page it continuously blew my mind as to how truly complex JavaScript really was, as well as many, many common pitfalls un-experienced & experienced people without a proper JavaScript understanding may have.

Reading that book series really opened my mind, and I also highly recommend it to anyone wanting to call themselves an expert JavaScript developer. Once you got that out of the way, there are 2 extra resources I highly recommend to get an even further, more advanced JavaScript knowledge;

• JavaScript, The Better Parts : An amazing talk by D. Crockford that talks about JavaScript’s biggest weaknesses, it’s “Foot Guns,” and how to utilize them as its strengths.
• The Two Pillars of JavaScript : a solid article by recognized JavaScript Medium writer Eric Elliott that talks about the 2 great pillars of JavaScript: Prototypical Inheritance and Functional Programming

Once you have a profound understanding of JavaScript, proceed with ECMASCript 2015 (also known as ES6), the latest, and current JavaScript standard. Smashing Magazine’s article ECMAScript 6 (ES6): What’s New In The Next Version Of JavaScript is a great short review of what’s new in ES6. You can try ES6 in the browser using Babel’s online transpiler .

CSS can get messy and disorganized very, very quickly. There have been quite a few different methodologies proposed to write cleaner CSS, but 2 stand out which I highly recommend you read about ASAP to stay competitive:

• SMACSS : Scalable and Modular Architecture for CSS. A flexible guide to developing sites small and large.
• BEM : a methodology that helps you to achieve reusable components and code sharing in the front-end.

I personally prefer SMACSS because of it’s cleaner look, but some companies and CSS Frameworks still use BEM, so it’s worth knowing both.

You should also start focusing on your CSS’s performance. Smashing Magazine’s article Managing Mobile Performance Optimization and HTML5 Rocks’s article High Performance Animation did a solid job at providing a head start on this. A quick read through both articles should give you a solid foundation.

JavaScript Bundlers

By now you should have strong understanding of Grunt or Gulp. The next step is adding a JavaScript bundler to your task runner, which will allow for a more modular organization of your JavaScript application.

The two biggest players right now are:

• Browserify : lets you require modules in the browser by bundling up all of your dependencies.
• Webpack : basically Browserify on steroids. Harder to configure and set up.

Scotch.io’s mini-course Getting Started with Browserify can provide you a jump-start with browserify, while David Fox Powell article Why Can’t Anyone Write a Simple Webpack Tutorial ? is a great, fun to read introduction to webpack.

Personally I haven’t spent a lot of time using webpack, but in my time with it, I have to say it’s been amazing — even if it’s slightly harder to set up. If you are just getting started, I’d go for Browserify since it’s a lot simpler to set up. Just be aware that webpack is the future, and what bigger projects are starting to use.

ReactJS is quickly gaining popularity, and it doesn’t seem to be slowing down — to the extent that people are asking “Is React killing Angular?”

Scotch.io’s Learning React.js: Getting Started and Concepts provides a solid overview of React. Once you got that out of the way, continue with Egghead.io’s course on React Fundamentals where you will build a fully working ReactJS app and then migrate it to ES6 syntax. You can follow up with the official ReactJS documentation which is very well made and will allow you to fully master it.

Since React is only the view, it’s highly recommended you learn Redux. Most courses on Redux are a bit complex in my opinion, but CSS Tricks Leveling Up with React: Redux does score a great balance between simplicity and being informative at getting started with Redux.

You might have also heard of Flux at this point, but if you’re wondering why you should use Redux over Flux, check out the question on Stack Overflow Why use Redux over Facebook Flux? which was answered by Redux’s creator!

Looking back on my mistakes and what I learned

I made a lot of mistakes in my 2 years of learning web development. Overall, I think my biggest mistake was not mastering the basics before moving on to libraries and frameworks. I guess this applies to almost every programming language out there, but in my opinion it applies even more to JavaScript. This is because in many ways, JavaScript is a broken language and contains a lot of “Foot Guns” (you should have heard of this if you watched D. Crockford’s talk on “JavaScript, the better parts” I mentioned earlier). These can make life insufferably hard if you don’t fully understand them.

I recall once having gotten stuck in an AngularJS issue with $scope which took me 3 days to debug, only to find it wasn’t even an AngularJS issue, but a JavaScript issue that I caused myself because of failing to understand how this works.

It’s strange that I don’t see this talked about as often. I didn’t always care for writing clean code, but honestly it’s one of the things I’m most proud of having learned. This is because everyone loves to complain how their last place had one of the worst, ugliest code base in the world. So why can’t anyone talk about how great their last one was? How their code ended up so clean and well made they were proud of it?

This is a trend I’d like to change, and I believe a difference can be made if enough people push for it. Strive to make variable and function names understandable in English, even if you have to write a bit more. Not doing so will only lead to you having to manually document it sometime in the future to make it clearer. This will also cause your overall codebase to become harder to understand by new developers and yourself. Yes, yourself. Why yourself? Because if you’re not enforcing clean code, what makes you think your coworkers should enforce it and write clean code for you to easily understand? Let’s lead by example.

And if that isn’t a good enough incentive, people very often recognize and value clean code writers. You’ll find that by writing clean code your coworkers and friends will enjoy working with you even more, and in turn, you’ll live a happier life.

Some of you might notice I also didn’t make much of an emphasis on jQuery. This is because in my experience, I found jQuery did me more harm than good at first. Some of you may not agree, but please let me explain: When I first learned it, the general idea I understood was that jQuery was everywhere and that you could use it for pretty much everything. Because of this, I got used to using jQuery for pretty much anything, and for any problem I encountered, I looked for a solution for it that used jQuery.

Don’t get me wrong, jQuery was awesome in my time using it, so awesome in fact, that I blindly ignored that 90% of what I did with jQuery could be done natively in modern browsers in a similarly easy syntax.

You may now be thinking: “So what’s wrong with that? jQuery doesn’t weight all that much anyway and using it you still end up writing less code than if you did things natively.” But using jQuery over native APIs wasn’t the problem. The problem was that my entire way of thinking and all the solutions to common problems I knew up until that point required jQuery to work. And this became a huge problem when I got my first project and was told jQuery wasn’t a dependency.

Using jQuery made me useless without it, and made me completely ignore the native methods and solutions that have always existed. It made all my solutions less portable too, since using them required jQuery.

Since then, I’ve strived to not use jQuery unless it is absolutely necessary and truly provides big improvement in efficiency and readability to our codebase (for example, heavy DOM manipulation).

Once again, don’t get me wrong, jQuery is great, but if I could go back in time and meet my past self that was just learning web development, I’d heavily advise myself against learning jQuery altogether until I’ve learned how to do things without it. If you are having trouble doing the switch like I did, check out You Might Not Need jQuery .

As for course material; while a lot of CodeSchool’s courses were outstanding (The HTML & CSS branch was specially fantastic), even if a few of their courses on frameworks fell flat a bit flat (AngularJS, BackboneJS, etc.).

I also took quite a lot of Pluralsight courses, which I didn’t mention because after all this time, I’ve reached the conclusion that picking their learning path is overall a bad idea and unreliable . Since their courses are made by teachers who aren’t always (in my opinion) very good at teaching, I found their course quality fluctuates wildly since their course quality standards are non-existent. I’ve had courses where even the person giving the course sounded like he was falling asleep. And I honestly don’t have the attention span to keep paying attention on a 6–10 hour course — and a lot of them last that long, if not longer.

I spent a good 80–100 hours of training in Pluralsight, and I honestly want a good part of it back. Don’t get me wrong, I had a few amazing courses on Pluralsight, but their focus on quantity over quality really made me waste my time. I could have learnt so much more if I had taken courses from better sources like Egghead.io and CodeSchool, where they value more quality of quantity.

The only reason I could ever think of someone using Pluralsight is to take a course that no other website has in some more obscure technology (like Installshield, or Xamarin), or to take a few very specific courses that they know were very well received and reviewed (For example, John Papa’s Angular Fundamentals).

Overall, if you want to use Pluralsight, be sure that you are taking courses hand-picked by someone that took them first and that are recognized as high quality and useful.

I also recently tried Team Treehouse training and I’ve got to say, I’m amazed at the quality that went into their courses, even rivaling that of CodeSchool, and their course material is highly extensive.

After skimming through the HTML, CSS and JavaScript learning paths there, I see you could easily acquire the foundation of pretty much everything. Don’t believe me? Just look at their learning tracks and tell me it’s not amazing. Sure, it’s a bit expensive at $30 USD a month, but in my opinion it’s incredibly worth it. (I’m paying for it right now to learn WordPress since I need it for a freelance project and the material is great).

A word on paid courses

I felt a need to speak about this since I’ve noticed the general consensus that you can learn programming without paying a dime and be as competitive as one that paid for a course. While true, I cannot stress enough the value paying for the right course has. Sure, quite a lot of the most valuable course material I’ve written about is free, but a lot of it is also paid. Mainly because sometimes you just can’t beat having someone carefully explain things to you in a visual way.

Yes, there are terrible learning paid courses which I would advise against since their value proposition is questionable (see Pluralsight), but others like Egghead.io, CodeSchool, and Team Treehouse offer outstanding bang-for-your-buck, despite their relatively costly monthly subscription ($25-$30 a month). Plus, they all have free 7–15 day trials so you can see which one works best for you.

If you play your cards right, paying 1–2 months of either of them can easily net you knowledge you would only otherwise get after stumbling upon countless of articles and blog posts over a year. They’re honestly that good.

So yes, they are not necessary, but if you can afford at least one month, you can be sure it will give you a strong edge.

The secret sauce for success

I’ve met a lot of developers over the past 2 years I’ve been a web developer. Along my journey, I’ve met a few developers who really stood out — developers who were clearly in a league of their own, and to whom me and everyone else looked up to. I found these individuals shared quite a few characteristics, which I’d like to share with you right now. These are in my opinion the secret sauce to being a successful web developer:

• Love what you do. This is simply the most important characteristic of them all. If you don’t love what you do (be it CSS Styling or JavaScript), it will truly show in what you do. Those who are passionate about what they do often clearly stand out from the crowd.
• Be generous and share your knowledge . It’s very easy to want to keep that new CSS/JavaScript hack you found that solves the project’s issues a secret, but please don’t. The people who share their knowledge the most are often the most valuable, since they can be placed in any kind of team and improve it’s quality by a huge margin.
• Always be on the lookout for new things . Most of the successful developers I’ve met share this common trait. Whether it be by reading blogs, spending lots of time in programming related discussions, or even talking about what’s new in web development during lunch breaks. Being on the lookout for new things all the time allows the best developers to always stay ahead of the curve.

The shortest route

Whew, this article took a while to finish (6 hours and counting). We’re almost done! You may be wondering: “Ok, cool story, but what’s the quickest route?” And so, here it is.

I’ve organized this in the way that I would take it if I could go back and do things right. I also added a few bonuses, which I would have loved to have had back then. Enjoy!

• CodeSchool or Treehouse’s Javascript learning path (paid) OR Codecademy’s Javascript course
• Eloquent JavaScript
• You Don’t Know JS
• JS: The Right Way
• Learn ES6 by Egghead.io
• CodeSchool or Treehouse’s HTML & CSS learning path(Paid) OR HTML and CSS: Design and Build Websites by John Ducket OR Codecademy’s HTML & CSS course .
• Specifics on CSS Specifity by CSS Tricks
• Learn CSS Layout
• 9 basic principles of responsive web design by Front
• Responsive Web Design Fundamentals by Google on Udacity (Take if you didn’t use CodeSchool or Treehouse learning path)
• Managing Mobile Performance Optimization by Smashing Magazine OR Browser Rendering Optimization and Website Performance Optimization by Google on Udacity
• Web fundamentals by Google

Developer Tools

• Explore and Master DevTools by CodeSchool
• Learn Git by Codecademy and Try Github by Codeschool
• Introduction to Linux Commands by Smashing Magazine
• Automate Your Tasks Easily with Gulp.js by Scotch.io
• Design Decisions in AngularJS by Google Developers (Intro to AngularJS)
• AngularJS fundamentals by Egghead.io
• John Papa’s Angular Styleguide
• Creating a Single Page Todo App with Node and Angular (MEAN) by Scotch.io
• AngularJS application structure by Egghead.io (Paid) OR Scotch.io’s Angular Courses
• Learning React.js: Getting Started and Concepts by Scotch.io
• Intro to webpack by Egghead.io
• React Fundamentals by Egghead.io
• Leveling Up with React: Redux by CSS Tricks
• NodeJS tutorials by NodeSchool.io
• How I explained REST to my Wife
• Creating a Single Page Todo App with Node and Angular by Scotch.io (Node, ExpressJS, MongoDB, Angular, REST)

Bonus: Resources

Completely optional, but some of my favorite articles and resources which I’ve found over the years which you will probably love if you are interested in their respective topic.

• Web Design in 4 minutes . A very creative and original interactive tutorial that teaches you the fundamentals of web design.
• Awwards . Looking for web design inspiration? Look no further.
• Why Hiring is so hard in tech by Eric Elliott. Here Eric is does an amazing job at summarizing how it’s surprisingly hard to find great developers, and how to become one.
• NoSQL database systems mega comparison by Kristof Kovacs. This is a superb comparison between the most popular NoSQL database systems out there. MongoDB, Redis, CouchDB, Cassandra, ElasticSearch, they and more are all here.
• XSS Game . Cross-site scripting (XSS) bugs are one of the most common and dangerous types of vulnerabilities in Web applications. Using this awesome resource you can learn how to find and exploit XSS bugs, and how to prevent them from happening to your web application.
• How To Write Unmaintainable Code . Hilarious article on how not to write maintainable, clean code.

Bonus: My tools

I thought it’d also be nice to share some of the tools I discovered (some well known, some not so much) that have made my life easier as web developer so here they are.

• Jetbrains Webstorm : Full featured Web Development IDE. (My editor of choice) Paid, but offers a 1 year free license for students.
• Atom.io : Highly extensible text editor with IDE like features rivaling Webstorm. Free.
• Sublime Text : Lightning fast text editor with plugins support and an aesthetically pleasing look. (I normally keep Webstorm/Atom installed as IDE for serious work, and Sublime Text installed for quick edits to files.)
• caniuse.com : Browser support is critical for websites, and this is the #1 resource at figuring out what features are supported by which browser version and which are.
• Cloud 9 : Cloud based development environment and IDE with Git support that runs on Linux. Great for programming remotely and testing out NodeJS or other server side things without needing to install anything on your machine
• CodePen , Plunker and JSFiddle : Great cloud based front end playgrounds that let you do quick HTML/CSS/JS demos you can share, or work on later on if you create a free account. CodePen is often best for CSS related things because of it’s minimalistic interface and plethora of CSS related features, Plunker for JavaScript demos because of it’s powerful JS features, and JSFiddle for demos that you wish to collaborate with others in real time thanks to it’s live editor sharing collaboration feature.
• Vanilla List : A repository of JavaScript plugins and libraries using only vanilla JavaScript (meaning they require no libraries to work, like jQuery)
• YouMightNotNeedjQuery : You probably don’t. See for yourself.
• PublicAPIs : Ever wondered what public APIs exist? Look no further!
• Gravit.io : Cloud based design application rivaling adobe illustrator. (Free!) Useful for quick mockups and web design.
• Adobe Kuler : Webapp to help you create harmonious color combinations for any website. Also has an “Explore” showcase of color palettes built by other designers as well as a ranking system to help inspire you.
• Name that color : Stop spending lots of time figuring out how to name your color variables in less/sass and just use their rightful name with this webapp

I’d just like to say I really enjoyed writing this, and it makes me really happy to have been finally able to give something back to the incredibly supportive programming community everywhere.

As some of you already noticed, this is my first blog post, but you can be sure I plan to write more. Just don’t expect one every week. Remember: quality over quantity!

If any of you have any questions left, feel free to leave a comment and I’ll do my best to get back to you ASAP.

I hope this was useful to you guys, until next time, Best!

March ’18 Update : For those curious as to what I’ve been up to, here’s a quick status update!

https://medium.com/@sgarcia.dev/status-update-im-still-here-with-cool-stuff-incoming-f031bab49eca

freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

If you read this far, thank the author to show them you care. Say Thanks

Learn to code for free. freeCodeCamp's open source curriculum has helped more than 40,000 people get jobs as developers. Get started

What Is Web Development?

Web development encompasses a broad range of tasks from coding, to technical design, to performance of a website or application running on the internet.

Web development is the act of building, creating and maintaining websites. The field encompasses a broad range of tasks including everything from coding, to technical design, to the performance of a website or application running on the internet. Web development consists of front-end and back-end components:

Front-End Web Development vs. Back-End Web Development

• Front-end development consists of the user interface (UI) and the look and feel of the website or application. 
• Back-end development consists of the databases, logic, APIs, servers and everything else that powers the website behind the scenes.

What Are the 3 Types of Web Development?

There are three main types of web development: front-end, back-end and full-stack.

Web development broadly encompasses the whole of a website's functionality, but the work itself is often broken down into three types: 

Front-end development is responsible for the aspects of a website that users see and interact with: the user interface (UI) . Front-end developers are well-versed in HTML , CSS and JavaScript , often working closely with design and UX teams to capture both the intended look and feel of the site, while also creating a quality user experience across multiple device types.

Back-end development is responsible for all the aspects of a website that users do not see. This is also known as server-side development because back-end developers focus primarily on the behind-the-scenes logic, APIs and database interactions that power the site. 

Full-stack development is a more holistic approach where the developers responsible for the site or app take care of the entire development stack, from the inner workings typically performed on the back-end to the presentation layer normally handled by front-end developers.

Food for Thought Front-End vs. Back-End Development: Which Should You Prioritize?

What Does a Web Developer Do?

Web developers develop websites, specifically by creating the site’s code, connecting it to a server and maintaining its accessibility to users.

Web development is responsible for creating the sites and applications we use through a web browser in our day-to-day lives. Web developers, often working in teams or alongside other tech professionals like data scientists , UX designers and product managers , use specialized techniques and a thorough knowledge of one or more programming languages to create a foundation for where the website’s database will live, known as a back-end. 

The back-end is dependent upon the website’s server, which stores web pages and applications to be loaded into the web browser upon request.  The server acts as an intermediary between the web page or application and the data stored within the server, facilitating communication between the database and the client.

Web developers are also responsible for creating the front-end of a website through the use of HTML , CSS and JavaScript , which creates the layout and style that the user sees and interacts with when using the site.

Finally, web developers are responsible for maintaining the site's functionality and overall performance over time.

Is Web Development a Good Career? 

According to the latest U.S. Bureau of Labor Statistics , the average salary for a web developer is $78,000, and positions are expected to grow 13 percent from 2020 to 2030, faster than the average for other occupations.

The average salary of a web developer was $77,200, according to the latest U.S. Bureau of Labor Statistics . Additionally, web developer jobs are expected to grow 13 percent from 2020 to 2030, faster than the average for other occupations.

Web developers are in high demand. There are currently more than 5,000 front-end developer jobs at nearly 2,000 companies nationwide on Built In's job board.

Related Reading From Built In Experts So You Want to Be a Full-Stack Developer? Here Are the Skills You Need.

Recent Web Development Articles

web development Recently Published Documents

Total documents.

• Latest Documents
• Most Cited Documents
• Contributed Authors
• Related Sources
• Related Keywords

Website Developmemt Technologies: A Review

Abstract: Service Science is that the basis of knowledge system and net services that judge to the provider/client model. This paper developments a technique which will be utilized in the event of net services like websites, net applications and eCommerce. The goal is to development a technique that may add structure to a extremely unstructured drawback to help within the development and success of net services. The new methodology projected are going to be referred to as {the net|the online|the net} Development Life Cycle (WDLC) and tailored from existing methodologies and applied to the context of web development. This paper can define well the projected phases of the WDLC. Keywords: Web Development, Application Development, Technologies, eCommerce.

Analysis of Russian Segment of the Web Development Market Operating Online on Upwork

The Russian segment of the web services market in the online environment, on the platform of the Upwork freelance exchange, is considered, its key characteristics, the composition of participants, development trends are highlighted, and the market structure is identified. It is found that despite the low barriers to entry, the web development market is very stable, since the composition of entrenched firms that have been operating for more than six years remains. The pricing policy of most Russian companies indicates that they work in the middle price segment and have low budgets, which is due to the specifics of the foreign market and high competition.

Farming Assistant Web Services: Agricultor

Abstract: Our farming assistant web services provides assistance to new as well as establish farmers to get the solutions to dayto-day problems faced in the field. A farmer gets to connect with other farmers throughout India to get more information about a particular crop which is popular in other states. Keywords: Farmers, Assistance, Web Development

Tradução de ementas e histórico escolar para o inglês: contribuição para participação de discentes do curso técnico em informática para internet integrado ao ensino médio em programas de mobilidade acadêmica / Translation of summary and school records into english: contribution to the participation of high school with associate technical degree on web development students in academic mobility programs

Coded websites vs wordpress websites.

This document gives multiple instructions related to web developers using older as well as newer technology. Websites are being created using newer technologies like wordpress whereas on the other hand many people prefer making websites using the traditional way. This document will clear the doubt whether an individual should use wordpress websites or coded websites according to the users convenience. The Responsiveness of the websites, the use of CMS nowadays, more and more up gradation of technologies with SEO, themes, templates, etc. make things like web development much much easier. The aesthetics, the culture, the expressions, the features all together add up in order make the designing and development a lot more efficient and effective. Digital Marketing has a tremendous growth over the last two years and yet shows no signs of stopping, is closely related with the web development environment. Nowadays all businesses are going online due to which the impact of web development has become such that it has become an integral part of any online business.

Cognitive disabilities and web accessibility: a survey into the Brazilian web development community

Cognitive disabilities include a diversity of conditions related to cognitive functions, such as reading, understanding, learning, solving problems, memorization and speaking. They differ largely from each other, making them a heterogeneous complex set of disabilities. Although the awareness about cognitive disabilities has been increasing in the last few years, it is still less than necessary compared to other disabilities. The need for an investigation about this issue is part of the agenda of the Challenge 2 (Accessibility and Digital Inclusion) from GranDIHC-Br. This paper describes the results of an online exploratory survey conducted with 105 web development professionals from different sectors to understand their knowledge and barriers regarding accessibility for people with cognitive disabilities. The results evidenced three biases that potentially prevent those professionals from approaching cogni-tive disabilities: strong organizational barriers; difficulty to understand user needs related to cognitive disabilities; a knowledge gap about web accessibility principles and guidelines. Our results confirmed that web development professionals are unaware about cognitive disabilities mostly by a lack of knowledge about them, even if they understand web accessibility in a technical level. Therefore, we suggest that applied research studies focus on how to fill this knowledge gap before providing tools, artifacts or frameworks.

PERANCANGAN WEB RESPONSIVE UNTUK SISTEM INFORMASI OBAT-OBATAN

A good information system must not only be neat, effective, and resilient, but also must be user friendly and up to date. In a sense, it is able to be applied to various types of electronic devices, easily accessible at any whereand time (real time), and can be modified according to user needs in a relatively easy and simple way. Information systems are now needed by various parties, especially in the field of administration and sale of medicines for Cut Nyak Dhien Hospital. During this time, recording in books has been very ineffective and caused many problems, such as difficulty in accessing old data, asa well as the information obtained was not real time. To solve it, this research raises the theme of the appropriate information system design for the hospital concerned, by utilizing CSS Bootstrap framework and research methodology for web development, namely Web Development Life Cycle. This research resulted in a responsive system by providing easy access through desktop computers, tablets, and smartphones so that it would help the hospital in the data processing process in real time.

Web Development and performance comparison of Web Development Technologies in Node.js and Python

“tom had us all doing front-end web development”: a nostalgic (re)imagining of myspace, assessment of site classifications according to layout type in web development, export citation format, share document.

Web Application Development Essay

• To find inspiration for your paper and overcome writer’s block
• As a source of information (ensure proper referencing)
• As a template for you assignment

The Ways to Specify the Colors in CSS: Pros and Cons

Enterprise web development and distributed web applications, the browsers’ internal style sheets differences, the compatibility of website with the browsers, designing for iphone users, issue of contents and devices compatibility: tables, w3c standards for developing content for wireless technologies, works cited.

There are multiple methods of the color indication in CSS: hexadecimal color value, RGB, HSL, color keywords and X11, etc. (Dawson par. 1). Hexadecimal value is the most popular method to specify colors. It provides a large color range and is very precise, it thus widely supported by the internet browsers. RGB color value is also well elaborated.

One can specify the color by combining RGB red, green, and blue values. HSL color value successfully compliments RGB notation. HSL provides the combination of hue, saturation, and brightness. Color keywords specification has the easiest format because it doesn’t require any calculations of degrees and percentages. Previously, the keywords notation was too basic but it was expanded with the X11 color palette. Nevertheless, the lack of its support by browsers makes it difficult to use.

Nowadays, the programmers often argue about the best data models suitability for the application development. But according to the experience of many web developers, all the programming languages have advantages and disadvantages (Saint Laurent par. 4).

The main challenge in the development of enterprise applications is the choice of the language, data models, and scripts or their combination to provide the product’s efficiency. The choice of the programming language must be determined by the consideration of the multiple nuances and requires the strategic research. The second challenge is the development of the flexible design that could be suitable for a big number of devices. The success of the content delivery depends on the user’s technological capability.

The abrupt differences can be easily smoothened by the implementation of the layouts that can be adjusted according to browser’s environment. For example, one can choose a relative layout or an elastic layout. The relative layout adjusts the size of the page according to the browser’s view, and the elastic layout can be expanded or narrowed in size (Dawson par. 4).

The design will be developed for the travel company. It requires many pictures, it should be bright enough to draw attention yet shouldn’t repel. The sizes of fonts, the color matching, the sizes of pictures must be taken into consideration because the browsers can display them differently. The layout format will be the most relaxed and mutable. However, the smart placing of page elements and their correspondence with the website’s style is crucial.

The design for iPhone users is more fixed; it can be kept up to the certain rules while the designing for browsers has to deal with the multiple differences of browsers’ capabilities. Nevertheless, designing for iPhones requires the designer’s comprehension. For example, a designer need to know that the element must be smaller, the text formatting must be suitable for the small screen, and the links should consist of more than one word to tap easily (Kyrnin par. 6).

The large default tables can’t be completely seen on the screen of the mobile devices. Some alterations thus are required. A designer needs to take into consideration the amount of the table’s content and the device’s capability to support CSS and JavaScript. The content can be distributed in small tables, converted into a pie chart, or placed in PDF file with the link available for a customer (“Tables in Responsive Design” par. 8).

The W3C standards are needed for the developmental processes regulation and the positive outcomes of the design. HTML is considered to be a standard, and it is commonly accepted (Dubost par. 10). Moreover, the wireless devices can support only HTML and its variations.

The technology’s format must be considered by a designer, and the rules must be followed. For example, a designer needs to know that the mobile technologies usually do not support Flash and Cookies. A designer also needs to consider that the sizes of the elements should be relative.

“Tables in Responsive Design.” Liquid Light 10 December 2013: n.pag. Web.

Dawson, Alexander. “A Guide on Layout Types in Web Design.” Six Revisions 22 July 2010: n.pag. Web.

Dawson, Alexander. “A Guide to CSS Colors in Web Design.” Six Revisions 1 June 2011: n.pag. Web.

Dubost, Karl. “My Web Site Is a Standard! And Yours?” W3C Quality Assurance 8 April 2002: n.pag. Web.

Kyrnin, Jennifer. “How to Write Web Pages for Mobil Devices: Tips to Design Web Pages that Work Well on Small Screen Mobile Devices.” About Tech . n.d. n.pag. Web.

Saint Laurent, Simon. “Web Application Development is Different (and Better).” Radar 29 January 2014: n.pag. Web.

• The Systems Development Life Cycle
• Different Programming Languages Analysis
• PDF Viewer in Firefox, Opera, and Chrome Browsers
• Information Security Basics: Web Browsers
• The CSS Zen Garden, Digital Design and Communication in the Kyoto Forest
• Web 2.0 Technology: Design Aspects, Applications and Principles
• Programming: Organizations as Socio-Technical Networks
• Object-Oriented, Event-Driven and Procedural Programming
• The Ideal HPC Programming Language
• Pros and Cons of Waterfall Model
• Chicago (A-D)
• Chicago (N-B)

IvyPanda. (2020, May 3). Web Application Development. https://ivypanda.com/essays/web-application-development/

"Web Application Development." IvyPanda , 3 May 2020, ivypanda.com/essays/web-application-development/.

IvyPanda . (2020) 'Web Application Development'. 3 May.

IvyPanda . 2020. "Web Application Development." May 3, 2020. https://ivypanda.com/essays/web-application-development/.

1. IvyPanda . "Web Application Development." May 3, 2020. https://ivypanda.com/essays/web-application-development/.

Bibliography

IvyPanda . "Web Application Development." May 3, 2020. https://ivypanda.com/essays/web-application-development/.

Web Development Articles

Accessibility on the platform.

• Web Design ,
• Web Development

Affordances, Signifiers, and Clickability

• Code Foundations ,
• HTML & CSS ,

Authentication and OAuth

• Cybersecurity ,

Authentication vs Authorization vs Encryption

Back-end web architecture.

• Game Development ,

Bootstrap: Creating Menus, Navbars, and Modals

Browser compatibility.

• Developer Tools ,

Building Apps With Vite

• Full-Stack Engineer ,

Building Projects with VS Code

Characteristics of a good test, code coverage, comparison of build tools, connecting page elements to a dataset, consider design while you build, create a url using slugs, create and view a web page on your computer, create stunning tailwind css forms: a step-by-step guide, create your first local html/css project, creating a react app.

• JavaScript ,

Creating a Website on GitHub Pages

Creating dynamic pages, data structure apis.

• Computer Science ,

Database Scaling Strategies

• Back-End Engineer ,
• Data Scientist ,

Dataset Basics

Debugging in visual studio, deploy rails to heroku, deploying a back-end with heroku, deploying a flask app, deploying a full-stack app with heroku, deploying a simple python script with flask, deploying a static site with netlify.

• Cloud Computing ,

Deploying to GitHub Pages

• Open Source ,

Depth-First Search: Conceptual

Design - color, from editor to output, getting started with heroku, getting started with netlify, getting started with the wix editor, getting started with visual studio code.

• Data Science ,

Getting Started with Visual Studio Code and Building HTML Websites

Getting user input in node.js, git setup for mac and windows computers.

• Bash/Shell ,
• Mobile Development ,

Going Beyond with Heroku

Going beyond with netlify, handy git operations, how to create a free aws account, how to create a website, how to use jupyter notebooks, how users scan: learning from eye tracking research, html: classes vs ids, html5 game development with phaser, http errors: 404, http requests, http requests in velo, implementing the redux store from scratch, installing and using postgresql locally, installing django, intro to mozilla developer network, introduction to cdns.

• Front-End Engineer ,

Introduction to Data Wrangling and Tidying

Introduction to load balancing, introduction to nosql, introduction to testing with mocha and chai, java program structure, javascript glossary, javascript guide: arrays, learning from solution code, mocking in tests, mongodb aggregation pipelines: a hands-on tutorial, mongodb aggregation stages explained, mongodb data, mongodb data modeling basics, mvc: model, view, controller, node package manager, outside-in test-driven development, push to github, react developer tools, react: the virtual dom, reading tests with mocha and chai, rebrandly url shortener api, red, green, refactor, represent everyday things with objects, request-response cycle i, request-response cycle ii, request-response cycle iii, ridesharing algorithms: optimization and iteration, run a full-stack web application, running javascript in the browser console, running tests and interpreting output with mocha and chai, set up with git and github, setting up a backend, setting up a wix account, setting up and using screen readers, setting up node, setting up postman, setup mongodb, spies with sinon, spinning up a local server, standard controller actions, test-driven development, testing types, the testing pyramid, the tsconfig.json file, thinking about errors in your code differently, training set vs validation set vs test set, typography design, up next on velo, use devtools, users don’t read web pages, web development change log, web programming on a chromebook, web security: not an add-on, web ui conventions, what is .net, what is a database index, what is a database, what is a relational database management system, what is a spa, what is a web app, what is an ide, what is an ide, what is asp.net razor pages, what is aws, what is crud, what is digital accessibility, what is express.js, what is json, what is node, what is product usability, what is programming, what is rest, what is spring boot, what is sqlite, what is the $w selector, why css-in-js, why learn asynchronous javascript, why object-oriented programming, wireframe to wire-fame, wireframing, wix built-in methods and functions, wix lightbox, working in the code panel.

What is Web Development?

Web development is the building and maintenance of websites; it’s the work that happens behind the scenes to make a website look great, work fast and perform well with a seamless user experience.

Web developers, or ‘devs’, do this by using a variety of coding languages. The languages they use depends on the types of tasks they are preforming and the platforms on which they are working.

Web development skills are in high demand worldwide and well paid too – making development a great career option. It is one of the easiest accessible higher paid fields as you do not need a traditional university degree to become qualified.

The field of web development is generally broken down into front-end (the user-facing side) and back-end (the server side). Let’s delve into the details.

Comparing Front-End and Back-End Development

A front-end dev takes care of layout, design and interactivity using HTML, CSS and JavaScript. They take an idea from the drawing board and turn it into reality.

What you see and what you use, such as the visual aspect of the website, the drop down menus and the text, are all brought together by the front-end dev, who writes a series of programmes to bind and structure the elements, make them look good and add interactivity. These programmes are run through a browser.

The backend developer engineers what is going on behind the scenes. This is where the data is stored, and without this data, there would be no frontend. The backend of the web consists of the server that hosts the website, an application for running it and a database to contain the data.

The backend dev uses computer programmes to ensure that the server, the application and the database run smoothly together. This type of dev need to analyse what a company’s needs are and provide efficient programming solutions. To do all this amazing stuff they use a variety of server-side languages, like PHP, Ruby, Python and Java.

What about Full-Stack Development?

If both Frontend and Backend development appeal to you, you could consider becoming a Full-Stack Developer .

Full-stackers take care of both the front-end and the back-end, and need to know how the web works on all levels, in order to determine how the client- and server-sides will relate. Naturally working up to this level of expertise will take longer, as there is more to learn.

Getting Started in Web Development

All this may sound daunting at first, but you don’t need to know everything at once. You will grow your knowledge progressively. And things will begin to click. 

The great news is, learning to become a developer is easily accessible and affordable. This is especially true with OpenClassrooms. Emily Reese, Web developer and Teacher at OpenClassrooms explains,

Whatever aspect of web development attracts you, we have programs that can help you reach your goals.

No matter your background, you can learn web development. Emily told us,

In undergrad, I studied art history and architecture and then decided to become a developer whilst I was working at Kickstarter because I saw how the web could complement creativity in the arts. The same is probably true for any field. Becoming a web professional allows you to participate in absolutely any field, because the web has become universally present in our professional lives. You can be a web developer and specialize in anything from the art world to the automobile industry.

The first step is to decide which aspect of web development interests you and then start out with one programming language.

For example, if you are interested in front end you can start by learning some HTML and CSS, then start working on projects as soon as you are comfortable with the basics. Our Web Developer Program is a perfect fit for this route. But others may suite you as well.

It also helps to join a discussion group or community of other web developers, so that you can troubleshoot, discuss ideas and get inspiration. That’s why you become part of the OpenClassrooms community when you enroll in a program on the site.

There are numerous resources online for learning all aspects of web programming. OpenClassrooms has a variety of free online courses to get you started, and accredited programs that you can also follow if you decide that this is the career for you. 

Check your inbox or spam folder to confirm your subscription.

I would like to know more

Hello Andrew, you can reach us at [email protected]

usefull information

this is a good beginning for me. thank you so much.

Quite informative. Already know what interests me in a web, the Client side. Thanks

You have said “Dear Student”. Where is my ID number?

In which program, certificate, diploma or degree?

Hi Kapona, are you a user on OpenClassrooms? If so, you’re a student to us 🙂

I really appreciate your effort to solve beginners problem

Thanks for helping Mentor

useful for beginners, appreciate your hard-work. Open Classroom will grow definitely, keep doing great work.

This looks really good. Thanks

You should definitely go for being a full stack developer, if you have the guts! That’s where the good money is at. But be warned, it ain’t easy.

Very Interesting.

Is the bachelor’s for front-end development valid in the United States?

Hello Leah, Thanks for your message. You can find more information here about the diploma. You may also want to submit your question to our student success team to help assess if it will meet your needs. Submit an your inquiry here.

Wishing you the best in your professional endeavors.

Thanks ! Very interesting

Great article for web developer. Thanks for sharing.

Nice and very interesting article this post is very useful for beginners.

Very good and deeply elaborated article. Thanks for sharing!

Thanks for giving a such usefull information . i get very usefull information also you write very well .

Nice article, the article is so useful.

Great read! You have explained everything in a clear and precise way. Very good and deeply elaborated article. Thanks for sharing!

this is a great article for me I read every thanks for sharing

I wonder if I should focus on one and become an expert in this field, or spend more time and become a full-stack and learn all-round skills

I was a beginner to the web development concept, but this information helped me out to clearly understand the concept.

I actually added your blog to my favorites list and look forward to getting the same quality content every time I visit your blog. Thanks a lot.

WELL CONTENT EASY TO LEARN

Thanks for a great information,This article is very interesting.

Thanks for sharing this helpful information. Very easy and understanding article.

Your email address will not be published. Required fields are marked *

Save my name, email, and website in this browser for the next time I comment.

• Full Stack Course
• React Native
• CSS Frameworks
• JS Frameworks

Web Development

Web development refers to the creating, building, and maintaining of websites. It includes aspects such as web design, web publishing, web programming, and database management. It is the creation of an application that works over the internet i.e. websites.

The word Web Development is made up of two words, that is:

• Web: It refers to websites, web pages or anything that works over the internet.
• Development: It refers to building the application from scratch.

Web Development can be classified into two ways:

Frontend Development

Backend development.

The part of a website where the user interacts directly is termed as front end. It is also referred to as the ‘client side’ of the application.

Frontend Roadmap

Frontend Development Roadmap

Popular Frontend Technologies

• HTML: HTML stands for HyperText Markup Language. It is used to design the front end portion of web pages using markup language. It acts as a skeleton for a website since it is used to make the structure of a website.
• CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language intended to simplify the process of making web pages presentable. It is used to style our website.
• JavaScript: JavaScript is a scripting language used to provide a dynamic behavior to our website.
• Bootstrap 4
• Bootstrap 5

Frontend Libraries and Frameworks

Backend is the server side of a website. It is part of the website that users cannot see and interact with. It is the portion of software that does not come in direct contact with the users. It is used to store and arrange data.

Backend Roadmap

Backend Development Roadmap

Popular Backend Technologies

• PHP: PHP is a server-side scripting language designed specifically for web development.
• Java: Java is one of the most popular and widely used programming languages. It is highly scalable.
• Python: Python is a programming language that lets you work quickly and integrate systems more efficiently.
• Node.js: Node.js is an open source and cross-platform runtime environment for executing JavaScript code outside a browser.

Back End Frameworks and Technology

• Framework: Laravel
• CMS: WordPress
• Framework: Express
• Framework: Django , Flask
• Package Manager: Python PIP
• Framework: Ruby on Rails
• Framework: Spring, Hibernate
• Framework: .NET
• Postgre SQL

In web technology, a database is a structured collection of data that is stored electronically and accessed via a web application. It serves as the backend component where data is stored, managed, and retrieved. Databases can be relational (like MySQL, PostgreSQL) using structured tables and SQL for queries, or non-relational (like MongoDB, CouchDB) which store data in flexible, document-oriented formats. They enable web applications to handle dynamic content, user data, transactions, and more by providing efficient storage, retrieval, and manipulation capabilities. Database management systems (DBMS) are used to interact with the database, ensuring data integrity, security, and performance.

Relational Database

A relational database stores data in tables, similar to a spreadsheet, where each table has rows and columns. The rows hold individual records, and the columns define the data attributes. Tables can be linked to each other through special keys, allowing related data to be connected.

• Postgre SQL : PostgreSQL is a powerful, open-source relational database that supports advanced SQL features and complex queries. It handles structured data, ensures ACID compliance, and is known for its reliability and extensibility.
• MariaDB : MariaDB is an open-source relational database that evolved from MySQL, offering improved performance, security, and features. It supports SQL queries, ACID compliance, and is highly compatible with MySQL.
• MySQL : MySQL is an open-source relational database management system that uses SQL for managing structured data. It’s known for its reliability, ease of use, and performance, widely used in web applications.

NoSql Database

A NoSQL database stores data in a flexible, non-tabular format, unlike traditional relational databases. Instead of using tables with rows and columns, NoSQL databases might use documents, key-value pairs, wide-columns, or graphs to store data. This allows them to handle large amounts of unstructured or semi-structured data efficiently. They are designed to scale easily and manage big data applications.

• Mongodb : MongoDB is a NoSQL database storing data in JSON-like documents. It handles unstructured data, supports powerful queries, and scales easily across servers, making it popular for flexible, scalable applications.
• Cassandra : Apache Cassandra is an open-source NoSQL database that is used for handling big data. It has the capability to handle structure, semi-structured, and unstructured data.
• Redis : Redis is an in-memory NoSQL database known for its speed. It supports various data structures like strings, hashes, and lists, making it ideal for caching, real-time analytics, and messaging.

Web Development Tutorials

Some important links on web development.

• Begin Web Development with a Head Start
• Why do you need a Responsive Website
• Top 10 Frameworks for Web Applications
• Web 1.0, Web 2.0 and Web 3.0 with their difference
• 10 Web Development and Web Design Facts That You Should Know
• How can I start to learn Web Development ?
• The Future Of Web Development
• Best Books to Learn Front-End Web Development
• Best Books to Learn Back-End Web Development
• 10 Things You Should Know As a Web Developer
• How to choose a Technology Stack for Web Application Development ?
• Top 10 Tools That Every Web Developer Must Try Once

Please Login to comment...

Similar reads.

• Web Technologies
• SUMIF in Google Sheets with formula examples
• How to Get a Free SSL Certificate
• Best SSL Certificates Provider in India
• Elon Musk's xAI releases Grok-2 AI assistant
• Content Improvement League 2024: From Good To A Great Article

Improve your Coding Skills with Practice

What kind of Experience do you want to share?

Tutorial 1 : An Introduction To Web Development

Welcome to the first tutorial of your web development short course, and congratulations on taking your first step towards becoming a fully-fledged web developer!

Introduction

In this course, you’ll learn all about becoming a web developer, from the responsibilities that a web developer performs on a day-to-day basis to the set of skills that you’d need to succeed in such a role. And, of course, you’ll also get your hands dirty with code: We’ll introduce you to the fundamental building blocks of the web and make sure you leave this course having developed your very first website!

What are we going to do in this tutorial?

• Learn what the role of a web developer is and discuss the different types of web developers
• Take a look at the skills required to become a web developer
• Preview what we’ll be learning over the next 5 tutorials
• Create your first webpage using a text editor and browser

Ready to dive into the magical world of web development? Let’s go!

1. Who is a web developer?

A web developer is at heart an interactive artist . They’re someone driven by a deep desire to create things . A web developer’s canvas is a user’s web browser.

Much like how a curious child takes pleasure in making toys by joining LEGO blocks—and then experiences a similar joy in taking things apart to see how they’re made, a web developer’s job is to use the basic building blocks of the web (like HTML, CSS and JavaScript) to create something complex like a webpage. Don’t sweat it! We’ll get into all of those terms soon.

It's also the web developer’s job to diagnose problems in a website’s functionality, to understand how something works by reading the code behind it, and to make changes to fix any issues. That essentially makes web developers the physicians of the world wide web. When we talk about the world wide web, we’re mainly referring to websites and web applications. At this point, the curious aspiring developer in you might be wondering, “What’s the difference between the two?”

Well, we’re glad you asked! A website is usually a simple page or a group of pages (the popular web comic site, xkcd , for example). However, modern websites are much more than that. Take Google Docs, for example . It has a nice interface that, once opened, looks very much like a desktop software like Microsoft Office. Such complex websites are often termed web applications . A web developer today is expected to know how to create and work with web applications. Having said that, most people use the terms interchangeably, so don’t get too hung up on the terminology!

Types of web developers

There are different types of web developers who focus on different areas. These include:

• Frontend developers: Frontend developers implement web page designs using HTML and CSS. They make sure the website looks pretty on different devices, and that the forms and buttons work.
• Backend developers: Backend developers create the backbone of the web application. They write code logic that handles a user’s input (for example, what should happen when you click the signup button after filling in a form).
• Full stack developers: Full stack developers do bits of both backend and frontend. Depending on the problem at hand, they can switch cape 🦸‍♀️🦸‍♂️ and move stacks. You can learn more about the differences between frontend and backend development in this guide .

There are many other specific roles in web development, like system architects, AI developers, machine learning and security engineers. These roles require more specialized knowledge of one or more of the above types of development, so many professionals in these roles will start by gaining some general web development experience.

2. What are the skills required to become a web developer?

What does it take to become a web developer? Essentially, just three things: HTML, CSS and JavaScript—the three pillars of the web, which we’ll be learning about over the next few lessons.

Together, these three pillars make every website work, defining the content to be displayed (HTML), telling a browser how to display that content (CSS), and making the content interactive (JavaScript), respectively.

A web developer is well versed in these three technologies. They can read other people’s code and make changes to it. They can find and debug bugs (shortcomings in existing code). A web developer might, at times, work on a new project (a new website) from scratch, or may have to work on an existing website and make it better. A typical day in the life of a web developer involves fixing bugs, developing new features (that is, enhancements) and webpages, and working with other developers to discuss ways to solve problems.

Don’t be overwhelmed by all of these details. You’ll soon see that they’re all very connected, and learning one of these automatically makes you good at a few others!

What’s the job outlook like for web developers?

In short, very good. Employment of web developers is projected to grow 16% from 2022 to 2032 , much faster than the average for all occupations. Demand will be driven by the growing popularity of mobile devices and ecommerce ( Bureau of Labor Statistics ).

While 2022 and 2023 brought with it news of  tech layoffs  due to over-hiring post-pandemic, web developers and software engineers looked further afield and found opportunities in a whole range of industries, from healthcare to finance.

Why AI won't replace developers

If you’re thinking “AI is going to wipe out web developer jobs” you’d also be mistaken.  In his New Yorker article  on whether coding is "over", seasoned programmer Jason Somers examines the impact of Chat-GPT and AI on development, and concludes:

Computing is not yet overcome. GPT-4 is impressive, but a layperson can’t wield it the way a programmer can. I still feel secure in my profession. In fact, I feel somewhat more secure than before. As software gets easier to make, it’ll proliferate; programmers will be tasked with its design, its configuration, and its maintenance.

This is echoed on the CareerFoundry blog, in our experienced software engineer Nicole Abramowski’s  profile of the future of AI and web development . Nicole states that basically, to work effectively with AI in coding, you'll still need to have a solid grasp of the fundamentals. She says:

In the end, working with AI is all about asking good and specific questions. If you don’t understand how different technologies work, and their use cases, you won’t be able to write good prompts.

So, if you don’t know the fundamentals, how will you know if the information is correct? And this is where these tutorials come in!

3. What we’ll be learning in the next five tutorials

No web development course is complete without a hands-on project. In this course, we’ll be using the three pillars of the web (HTML, CSS, and JavaScript) to build your first project, a personalized portfolio website.

Once you have these under your belt, picking up other tools and languages is much easier. Pay extra attention to the basics, as a shaky foundation leads to loads of confusion later on. We’ll also give you the resources needed to put your website online so that you can share it with your friends and family.

For now, we’ll start by getting a bird's-eye view of the web development world. We’ll talk about the tools we’ll use in this course, and we’ll also write some HTML.

In the second lesson, we’ll write more HTML and HTML elements, and create the rough layout of our project website.

In tutorial three, we’ll write some CSS to make our website mobile responsive, which means that our website will be viewable on computers, tablets, and mobile phones.

In lesson four, we’ll dive into some advanced CSS and add cool effects to our page.

In the fifth and final tutorial, we’ll learn how to write basic JavaScript. We’ll also look at form validations and other common elements of JavaScript programming.

To give you a tiny glimpse, this is roughly how your website will look like at the end of this course. Pretty cool, right?

Ready to get started? Let’s begin by setting up your developer environment.

Setting up your developer environment

For this course, we’ll need two tools that every web developer uses:

• A text editor to write code
• A web browser to see what we’re building

While you can use any web browser or text editor, we recommend using Google Chrome and Sublime for this course.

• Google Chrome can be downloaded from https://www.google.com/chrome/
• Sublime Text can be downloaded from https://www.sublimetext.com/3 .

Like any good craftsperson, it’s important that you know and understand your tools. For that reason, let’s take a brief look at what we have so far.

Google Chrome

Google Chrome is a web browser. You may or may not already be using Google Chrome for browsing the web.

A web browser allows us to view webpages (similar to the one you’re reading this very text on). We’ll use Google Chrome to view the results after writing and making changes to our code.

Sublime Text

Sublime Text is a popular text editor. A text editor is a very aptly named piece of software; it helps us edit text. It's similar to the default text editor that comes preinstalled on Mac or Windows, but has additional features like code highlighting to enhance our coding and debugging experience.

⚠️ Watch out! Sublime Text is a paid software with an unlimited trial period. You’ll occasionally see a dialog box popping up prompting you to pay for the software license. You can pay for it if you wish, but you don't need to just for this course .

This course is OS independent, meaning that you can follow it on Windows, Mac OS or Linux.

😎Pro tip : If you get stuck when installing Chrome or Sublime, or see any error messages, it's best to do a web search (try a Google or DuckDuckGo search) for the exact error message. It's likely that other people have had the same problem before us and a solution already exists.

After downloading, install it according to the instructions you’ll find on those websites. Once you’re done installing, you’re ready to move to the next section.

4. Your turn: Creating your first webpage

We’ll now use the tools that we downloaded and installed in the previous section to do our first development work, creating our first text on a webpage. We’ll use HTML for this purpose. Let’s talk about HTML quickly before we start creating our first page.

HTML stands for H yper T ext M arkup L anguage. In a nutshell:

• Hypertext simply means text that can jump from one point to the other. If you have ever clicked a link on a page (try this: google.com ), you’ve used hypertext.
• Markup is simply a way to structure content so that we can distinguish between different blocks of text.
• Language means a, umm, language. Computer languages are similar to real world languages like English and German, just very strict in their syntax.

HTML lets us structure our page and the data in it. Once we have a structure and data to work with, we can focus on style and functionality.

Okay, that’s enough theory for now. Let’s get right into it by opening Sublime Text.

⚠️ Watch out! Students frequently get stuck at this step, so take it slow.

Click File > Open Folder (or simply Open… if you are on MacOS). Notice that on MacOS, the toolbar is at the top of the screen (as shown in the screenshot below).

Once you select File > Open / Open Folder, it will open a new window that will allow you to select an existing folder or create a new folder. Navigate to your ‘Desktop’ and create the folder there. Creating the folder on your Desktop makes it easy to find later on.

Click on the little icon that allows you to create a new folder. It can look different on different operating systems.

On MacOS, it will look like this:

While on Linux, it will look like this. If you click it, you’ll be able to create a folder by giving it a name.

We’ll name this folder portfolio because that’s what our project is, but feel free to choose a different name.

⚠️Watch out! While it's not strictly required to follow the naming scheme that we use, we recommend you stick to our way for this course. This will make it easier to follow the course later on when we work with multiple files.

If all goes well, you should see a screen like the following.

From here, right click on portfolio in the left sidebar, and click New File . You should see a new file labeled “ untitled” . That’s okay, since we’ve not named it yet.

Let’s save the file. Click File > Save and you should get a window asking you to enter the file name. Here, enter index.html and click save.

We name it specifically ‘index.html’ as per convention. By default, the entry point into a website is called the index page, hence the name.

Also, make sure you save the file inside the portfolio folder. Here’s what you should see now.

Now it’s time to write our first few lines of code! In this lesson, we’ll just get our page up and running. In the next lesson, we will dig into the meaning of each line, talk more about what HTML is, and put more structure into place.

🙋  Just a heads up: The code snippets in the video might not match exactly with the code snippets in the tutorial text. That’s okay—in programming, there is usually more than one correct way of accomplishing the same result. Rest assured, you’re learning the same concepts!

So let’s get started coding your first webpage. Type the following code as is into your index.html file:

Done already? Good. Here’s how it should look on your screen.

View code changes on GitHub >

Okay, good work! You just wrote some real HTML code. It’s time to see how it looks in a browser. This is called running the code and we’ll be doing it all the time in this course.

To run your HTML, open the Google Chrome web browser that we installed previously. Once there, press Ctrl+O on Windows and Linux or Cmd+O on Mac to open the file explorer dialog box.

Navigate to the Desktop and then portfolio folder and you should see the index.html file that we just wrote some code in. Open that file and you should see something like the following:

If you see the above page, give yourself a pat on the back. You just created your first functional webpage. Notice where the text “ First Webpage ” and “ Hello World ” appear.

Let’s go back to Sublime Text and try to change the Hello World on line 7 to Hello World, check out my website! Save it and refresh the page in Chrome. You should see an updated version of the text.

Congratulations! You just created and edited your first webpage and viewed it on your browser. With this, you’re well on your way to building your first website.

Aside on “Github commit URLs”

Throughout this course, you’ll occasionally see a Github ( https://github.com ) link, like the one above. Github is a website that developers (and even non-developers) use to host code projects, and share it with others. Each change (for example, change to our heading) is called a ‘commit’ and the link under the images will take you to the corresponding commit.

This link will take you to the exact point in the project’s history and show you what has changed. For example, the above link shows that the line in red was removed and the line in green was added . That’s the change we made.

As your projects grow, this becomes very useful and we’ll use it extensively throughout this course.

And with that, our first tutorial comes to an end. Good work!

In lesson one, we learned what being a web developer means and the different sub-roles in web development. We also got a bird’s-eye view of the web development technologies that we’re going to study later in the course.

Then we installed the necessary tools and got our computers ready for the next couple of lessons in this course. We also created our first webpage, made edits to it and learned how to ‘run’ our code. That’s really good progress for step one! Next, we’ll dive into some syntactic aspects related to HTML, talk about all the HTML elements that we’ll be using in our course and create a basic structure of our portfolio page in HTML.

But wait, there’s more! If you’re feeling motivated and want to add more types of text to your webpage before the next lesson, why not give the practical challenge a try?

🧐 Practical challenge

Did you notice how the text on line 4 (<title>First webpage</title>) and line 7 (<h1>Hello World</h1>) appear in the tab name and in bold on the page respectively?

title and h1 (heading 1) are what we call HTML elements. There are many more such elements, like p (paragraph), h2 , h3 .. h6 (heading 2, heading 3…heading 6) and strong (bold text).

For your first challenge, try adding the following tags to your page with your own content

When you’re done, your page should look something like this. The text inside the tags ( “I am an explorer” , for example) can be customized to be whatever you want.

Your job is to write it as shown in the picture (maybe with your customized text) and explain to yourself what h3 , strong and p elements did. If you were successful in getting everything to work, post a screenshot and tag @careerfoundry on Twitter.

Did you figure out what each tag does?

h3 is a heading, just like h1 , but less important (and looks smaller). strong makes the text appear bold. p is short for paragraph, and is used for textual content.

📗References

• HTML Headings (<h1>, <h2> … <h6>)

Q. I’m still not able to figure out how to create a new folder on my desktop. Can you help me out with that?

A. If you’re not able to create a new folder via Sublime, you can create it using your File Manager (like Finder on MacOS). What’s important is that the folder gets created and you can open it up in the Sublime Text editor.

Q. Can I use Atom / Nodepad / Wordpad / Google Docs / ‘X’ to write code and Firefox / Safari / Opera as my browser?

A. While you can use the tool of your choice, we recommend that you to stick to the tools we use in this course. Once you get the hang of it, you can choose whatever works best for you.

Q. I didn’t understand the code that we wrote in this tutorial. What is h3 and strong? How does it work?

A. Don't worry. We’ll learn more about HTML in the next lesson and these questions will be answered for you.

Q. I am getting a ‘ Your file was not found ’ message on a dark and dull screen

A. Most likely you didn’t open the right file, or entered the wrong file path. Check it again and try doing it exactly as we did in the course.

Q. Why are we building a portfolio website and not an online game / animation / social network?

A. Given that this is an intro course intended towards newcomers to web development, we want to touch the important aspects of the web development scene and give you a feel of real world web development, but at the same time not overwhelm you with too many details.

If you have questions or feedback along the way, you can simply reply to any of the course emails you receive to share your thoughts with us. We’d love to hear from you!

Senior Program

You can become a job-ready web developer from scratch in as little as 6 months. Arrange a call with your program advisor today to discover how you can change your career from the comfort of your own home with the CareerFoundry Full-Stack Web Development Program .

Development Of Web Programming essay

Web programming languages have evolved from one technology to another. This evolution has been aided by the increased affinity and inclination of most people to the internet. The internet constitutes a global platform where different people and organizations converge to share ideas, information and resources. Programming languages are the enabling technologies behind the internet wave and most technological application used in numerous organizations across the world. The needs, complexities and functionalities of websites have expanded with the demands of internet users and expanding business objectives.

This study examines the evolution of web programming languages, the major types, their functionalities, the future of web-enabled applications and the programming languages/technologies that drive them. The major types of web programming languages include Ada, HTML, Basic, C++ DHTML, JavaScript, . NET, Java, Lisp, Ajax ,Java web 2. 0. Perl, Visual Basic and so on. Web Programming & Development The basic programming language that was first used in building most websites is the Hyper Text Mark-up Language (HTML). It is still in use today but different versions have been developed to increase its capabilities.

This language allows web developers to edit the look and feel of their web pages to suit their needs. A modification to HTML is the Extensible Hyper Text Mark-up Language (XHTML) and Cascading Style Sheets (CSS). HTML is easy to learn and its codes are executed through the incorporation of commands known as tags. CSS is a lot easier because it creates a distinction between the style, presentation controls and the content of the web pages. It makes programming easier by preventing a lot of HTML Coding. HTML can be described as a Markup language that comprises a set of tags which are used to describe web pages that are under construction.

These tags usually come in pairs that are capable of giving functionality to the web pages. HTML can enclose scripting languages such as JavaScript and is easily compatible with other web programming languages (Moller & Schwartzbach, 2006). The first programming language that serves as the basis of all other programming languages was created by Ada Lovelace and Babbage who wrote programs for the “difference engine” and the “analytical engine” (Sureau, 2008). By 1954, Fortran was created. It was the first high-level language to make use of a compiler.

Related essays:

• NAVAL essay
• Hacking In Ethical Way essay
• Political problem essay
• Web Programming essay

Fortran is the acronym for formula translation and it was invented by John Backus and researchers at IBM. The main purpose of Fortran was the translation of mathematical formulas and functions into computer code. Functions, Sub-routines and loops were introduced with Fortran II. In 1958, Lisp was invented by John McCarthy as a form of list processing programming language. It was well known for its use in meta-programming applications. It can also be described as a programmable programming language used most in artificial intelligence applications (Sureau, 2008).

Basic, an acronym for Beginner’s All-purpose Symbolic Instruction Code was designed in 1963 as an interactive code that could be interpreted. Basic has been used largely in the design of most PCs. Statistics reveal that by 2006, over half of the total number of developers for . NET platform used mostly Visual Basic. Microsoft still uses Basic today; Visual Basic is a flavour of Basic that is used in developing applications for daily use which is significantly influenced by the original BASIC. ASP is another programming language used for developing web applications.

Other flavors of BASIC include Microsoft Basic, Apple Basic, TI-Basic and so on (Sureau, 2008). Structured Query Language (SQL) is another programming language that is used in web programming. Most websites are database-driven and have the capability to supply information based on the users’ requirements. SQL is a database programming language that has a robust set of features for executing commands such as sorting, listing, backing up data and general management of data. SQL is used in the query of relational database management systems (RDBMS).

MySQL is another query tool used for relational databases and has the same functions as the SQL programming language but it is an open source technology. This means that anyone can add to it and modify the code according to their needs (Moller & Schwartzbach, 2006). Java is an object-oriented web programming tool developed by James Gosling and notable programmers at Sun Microsystems. It was initially released into the market as an interactive language known as oak in 1991. In 1994, it was rewritten, customized for the internet and became known as Java.

Java programming language derives its structure and syntax from elements of C and C++ programming languages. Java applications are compiled to structures known as byte code and can run seamlessly on interpreters known as Java Virtual Machines. Java is a free software application and is used rampantly in the development of numerous web and mobile applications (Sureau, 2008). Another interesting web programming tool is PHP, an acronym for Personal Home Pages Hypertext Processor that was introduced by Rasmus Lerdorf in 1995.

It is a scripting language that can be used in conjunction with HTML and other web programming languages. It allows web developers to build dynamic pages and it can produce a pure HTML page. PHP is a general-purpose, open-source scripting language that is suited for web development. It is implemented via the use of a web server and is very popular with web developers. It receives PHP code as input and produces web pages as output. It can easily be installed on any operating system and it is presently deployed at over 20 million websites all over the world.

PHP can perform server-side scripting and is in the league of operating systems such as Java Server Pages (JSP) invented by Sun Microsystems’, Microsoft’s Active Server Pages (ASP), and mod_perl (Sureau, 2008). JavaScript Programming Language, now officially known as ECMA Script was introduced in 1995 by Brendan Eich of Netscape. It is a dynamic programming language that has significant linkage to web browsers. It is extremely popular and quite easy to use when compared with other languages.

The main objective of JavaScript is to add interactivity to pages coded in simple HTML. It is a scripting language that is usually encoded into HTML code. It acts as an interpreted language and does not require a compiler (w3schools, 2009). AJAX is not a new programming language and is a combination of XML and JavaScript. It was made popular by Google when it was implemented in Google Suggest. AJAX is centered on JavaScript and HTTP requests and can be used to create faster and easy-to-navigate web-enabled applications (Moller & Schwartzbach, 2006).

Web Development

The differences, similarities and in-betweens

• Conference paper
• Cite this conference paper

• Karlheinz Kautz 5 &
• Sabine Madsen 5  

305 Accesses

The IS literature reveals considerable effort concerning the development of web-based systems. Particularly the differences and similarities between traditional systems development and web development and the applicability of traditional development methods are widely and controversially discussed. However, the discussions are still primarily based on normative arguments and lack support of empirical evidence (Eriksen, 2000).

This is a preview of subscription content, log in via an institution to check access.

Access this chapter

Subscribe and save.

• Get 10 units per month
• Download Article/Chapter or eBook
• 1 Unit = 1 Article or 1 Chapter
• Cancel anytime
• Available as PDF
• Read on any device
• Instant download
• Own it forever
• Compact, lightweight edition
• Dispatched in 3 to 5 business days
• Free shipping worldwide - see info
• Durable hardcover edition

Tax calculation will be finalised at checkout

Purchases are for personal use only

Institutional subscriptions

Unable to display preview.  Download preview PDF.

Similar content being viewed by others

The Rise of Disappearing Frameworks in Web Development

Return of the Great Spaghetti Monster: Learnings from a Twelve-Year Adventure in Web Software Development

Product or Service? An Interpretive Case Study of Web Development

Bansler J. and K. Becker, 1993, A Reappraisal of Structured Analysis: Design in an Organizational Context, ACM Transactions on Information Systems , 11 (2), 165–193.

Article   Google Scholar  

Barry C. and M. Lang, 2001, A Survey of Multimedia and Web Development Techniques and Methodology Usage, IEEE MultiMedia , 8 (2), 52–60.

Baskerville R. and J. Pries-Heje, 2001, Racing the E-Bomb: how the Internet is redefining Information Systems Development, Proceedings of the IFIP TC8/WG8. 2 Working Conference, July, Idaho, USA.

Google Scholar  

Braa K., Sorensen C. and B. Dahlbom, 2000, Changes — From Big Calculator to Global Network, in: Planet Internet , Studenterlitteratur, pp. 13–39.

Budde R., Kautz K., Kuhlenkamp K. and H. Züllighoven, 1992, What is Prototyping?, Information , Technology and People , vol. 6, no. 2+3, Northwind, Oregon, USA.

Carstensen P. and L. Vogelsang, 2001, Design of Web-Based Information Systems — New Challenges for Systems Development?, Proceedings of the European Conference on Information Systems (ECIS).

Chen L., Sherrell L.B. and C. Hsu, 1999, A Development Methodology for Corporate Web Sites, First ICSE Workshop on Web Engineering (WebE-99), Los Angeles, USA.

Curtis, B., H. Krasner and N. Iscoe, 1998, A Field Study of the Software Design Process for Large Systems, Communications of the ACVM , vol 31, no. 11, 1268–1287.

DeMarco T. and T. Lister, 1987, Peopleware — Productive Projects and Teams, Dorset House Publishing, New York, NY, USA.

Eriksen L. B., 2000, Limitations and Opportunities of System Development Methods in Web Information System Design, Proceedings of the IFIP TC8/WG 8. 2 Working Conference, Boston, USA, 473–486.

Floyd C., 1984, A Systematic Look at Prototyping, in: Approaches to Prototyping , Budde R. et al. eds., Springer Verlag, Berlin, Germany.

Greenbaum J. and D. Stuedahl, 2000, Deadlines and work practices in New Media Development, Proceedings of the 23rd IRIS conference, University of Trollhättan Uddevalla, 537–546.

Grudin J., 1991, Interactive Systems: Bridging the Gap between developers and users, IEEE Computer , April, pp. 59–69.

Hoick J., 2003,4 Perspectives on Web Information Systems, Proceedings of the 36th HICSS conference.

Howcroft D. and J. Carroll, 2000, A Proposed Methodology for Web Development, Proceedings of the 8th European Conference on Information Systems ( ECIS ), Vienna, July.

Järvinen P., 2001, On Research Methods, Opinpajan Kirja.

Kautz K. and S. Madsen, 2002, Applying System Development Methods in Practice — The RUP example, in:, Information Systems Development: Advances in Methodologies , Components and Management , Grundspenkis J. et al., eds., Kluwer Press, pp. 267–278.

Kautz K. and J. Pries-Heje, 2000, Systems Development Education and Methodology Adoption, Journal of Computer Personnel , Vol. 20, No. 3.

Lyytinen K., Gregory R. and R. Welke, 1998, The Brave New World of Development in the Intemetwork Computing Architecture (InterNCA): or how distributed Computing Platforms will change Systems Development, Information Systems Journal , Vol. 8, 241–253.

Murugesan S. and Y. Deshpande, 2001, Web Engineering: A new Discipline for Development of web-based systems, in: Web Engineering - Managing Diversity and Complexity of Web Application Development , Springer-Verlag.

Pape T. and K. Thoresen, 1987, Development of Common Systems by Prototyping, in: Computers and Democracy — A Scandinavian Challenge , Bjerknes et al., eds., Aldershot, Brookfield, USA, pp. 297–311.

Pressman R. S., 1998, Can Internet-Based Applications be Engineered?, IEEE Software , September/October, 104–110.

Roos D. T. and K. E. Schoman, 1977, Structured Analysis for Requirements Definition, IEEE Transactions on Software Engineering , SE-3, pp. 6–15.

Trues D., Baskerville R. and J. Travis, 2000, A methodical systems development: the deferred meaning of systems development methods, Accounting Management and Information Technologies , 10(1), 53–79.

Vidgen R., 2002, WISDM: Constructing a Web Information System Development Methodology, Information Systems Journal , 12 (3), 247–261.

Vidgen R., Avison D., Wood J. and A. Wood-Harper, 2002, Developing Web Information Systems ,Butterworth Heinemann.

Walsham G., 1993, Interpreting Information Systems in Organizations ,John Wiley & Sons.

Download references

Author information

Authors and affiliations.

Department of Informatics, Copenhagen Business School, Howitzvej 60, DK-2000, Frederiksberg, Denmark

Karlheinz Kautz & Sabine Madsen

You can also search for this author in PubMed   Google Scholar

Editor information

Editors and affiliations.

Monash University, Melbourne, Australia

Henry Linger  & Julie Fisher  & 

Boise State University, Boise, Idaho, USA

Wita Wojtkowski  & W. Gregory Wojtkowski  & 

University of Maribor, Kranj, Slovenia

Jože Zupančič

Swinburne University of Technology, Melbourne, Australia

Kitty Vigo  & Josie Arnold  & 

Rights and permissions

Reprints and permissions

Copyright information

© 2004 Springer Science+Business Media New York

About this paper

Cite this paper.

Kautz, K., Madsen, S. (2004). Web Development. In: Linger, H., et al. Constructing the Infrastructure for the Knowledge Economy. Springer, Boston, MA. https://doi.org/10.1007/978-1-4757-4852-9_37

Download citation

DOI : https://doi.org/10.1007/978-1-4757-4852-9_37

Publisher Name : Springer, Boston, MA

Print ISBN : 978-1-4419-3459-8

Online ISBN : 978-1-4757-4852-9

eBook Packages : Springer Book Archive

Share this paper

Anyone you share the following link with will be able to read this content:

Sorry, a shareable link is not currently available for this article.

Provided by the Springer Nature SharedIt content-sharing initiative

• Publish with us

Policies and ethics

• Find a journal
• Track your research