Introduction to web development

Web development has two main "ends":

• The front-end (presentation-oriented programming, i.e. the container)
• The back-end (data-oriented programming, i.e. the content)

We will see that:

• the line between the front-end and the back-end often blurs
• computer science theory surprisingly still plays a large role in web development

The front-end

The part that structures and styles the content:

• 🛡️ Structuring (e.g. HTML)
  • to enforce the sensibility (order) of visual components
• 🖼️ Styling (e.g. CSS)
  • to enhance the visual look-and-feel
• 📒 Scripting (e.g. JavaScript, PHP, Ruby, etc.)
  • to connect the front-end structure and style with the back-end
    • perhaps one could call this the "middle-end"?
  • also, to manage user input and data changes

Sometimes, front-end developers may have to take part in:

• 📷 Imaging (e.g. Photoshop or free Photopea)
  • to adjust (resize, crop, combine, etc.) visual assets provided by a client
  • to take the load off a design team, who might work with more complex imaging and graphics projects, by helping with simpler tasks such as image resizing and cropping

The back-end

To part that stores the content:

• 📒 Scripting (e.g. JavaScript, PHP, Ruby, Perl and other similar languages)
  • to process the results from database querying
• 🛢️ Database querying (e.g. MySQL, GROQ, MongoDB)
  • to get/set data from a database
• 🔐 Security
  • authorization to allow user into a system
  • authentication to see if a user is genuine

The other parts

All developers should know about:

• 🐙 Versioning or version control (e.g. Git, Mercurial)
  • not only submits content "to the cloud" but also to ensure backups if something goes wrong
  • to allow for collaboration by multiple developers within the same project(s)
• 🚀 Deployment (e.g. FTP, Jenkins, Netlify, Vercel)
  • to get that web project onto the Internet!
    • nowadays usually handled by a specialized team called development operations (aka devops)
• 📜 Documentation (e.g. GitBook or any wiki/blog program)
  • to communicate processes and findings for obvious reasons
• 👥 Organization (e.g. Scrum)
  • to plan and ensure that everything comes together
  • to assure quality of completed projects
  • to remedy any defects or issues
  • to discuss after launch any shortcomings and room for improvement (aka "retro")
• ✅ Optimization
  • to encourage universal accessibility
  • to improve performance (e.g. page load speed)
  • to continue improving
    • note: no product ever really "finishes"

As one can gather, a lot of web development involves tasks other than simply programming and coding (or just making things look nice)!