What Does a Web Developer Do?

Have you ever wondered what goes on behind the scenes while browsing the web? Think of a broken website you have come across. Or, one that had a button on a page that did not function. Or, one that was visually unappealing and poorly organized. If you have ever wondered what a web developer does, maintaining websites—and fixing broken items on a website—are just two of the core duties of a web developer’s job. 

Responsibilities of a Web Developer 

Here’s a more robust description of what web developers do: They use code to design, create, and maintain websites or web applications. Web developers guarantee users a smooth and friendly experience by continuously testing and debugging the functionality of the web application. 

Often, web developers will work alongside web designers, who primarily focus on the visual aspect of the website—making sure things look pretty (for example, the layout) and making sure things check out from a usability standpoint. Web developers must be open to accepting constructive feedback on how the site can improve or be more visually appealing to the users.

In this article, we will answer the question “What does a web developer do?” by providing an overview of the key responsibilities of the role. We will look at the three primary types of web developer roles and the tech skills those roles require. We’ll close the article by looking at career opportunities (and average salaries) for web developer professionals.

Flatiron Has Awarded Over $8.6 Million in Scholarships to Support Students in Their Education Pursuits

Learn More

The Three Types of Web Developers

There are three primary types of web developers: front-end developers, back-end developers, and full-stack developers. Let’s take a closer look at each role, plus the technical skills for web development that each role requires.  

Back-end developers 

Back-end developers create and maintain the server-side logic that powers the web application that allows the front end (what a user sees on a screen) and back end (the behind-the-scenes inner workings) to communicate with each other. 

An example of this would be Spotify, the music streaming service that allows users to create accounts and playlists they can manage. It’s the back-end developers who use the Spotify Application Programming Interface (API) to power these features. Developers will handle tasks like authenticating users accounts, storing the users preferences in a database, and interacting with Spotify’s servers to stream a user’s song requests.

Additional responsibilities of a back-end developer include managing servers, databases, and applications, and guaranteeing secure authentication and authorization. They also integrate APIs and document the functionality of the code. 

Depending on the size of the web development team, back-end developers will collaborate on different versions of the application using GitHub. Below are profiles of common programming languages, frameworks, and databases that many back-end developers use today.

Back-end development programming languages 

Developers use back-end programming languages to power the internal functionality of web applications. They handle operations that are invisible to the users. These include, for example, managing databases, handling requests from the servers, and interacting with APIs to deliver data and features that users will use and see on the website. 

Some popular back-end programming languages include:

  • Python is an easy-to-learn-and-use object-oriented programming language. It is commonly used in building software applications, as well as for automating tasks and analyzing data. Netflix, Spotify, and many other big-name companies use Python.
  • NodeJS allows developers to build server-side applications using JavaScript.
  • Ruby is a programming language used to build web applications.
  • PHP is a scripting language commonly used to create server-side logic for dynamic web pages.
  • Java is another programming language commonly used in building web and mobile applications.

Back-end development frameworks 

To enhance security and efficiency, back-end developers will often use back-end development frameworks. These are pre built tools that provide a foundation for developers to construct the server-side functionality of the website. They include pre-built functions and libraries that help speed up development tasks like user authentication, database integration, and API development. 

Some common back-end development frameworks include: 

  • Flask is a Python framework commonly used to build web applications. It is known for its simplicity and flexibility, which allows users to build small or large applications. Netflix uses Flask for parts of its back-end application.
  • Ruby on Rails is a web development tool that adds server-side logic to a back end. It is built on the Ruby programming language, and has helped startups build web applications quickly. Rails is known for its DRY (Don’t Repeat Yourself) concept, which allows developers to reuse and organize code efficiently. 
  • Django is a back-end framework primarily used with Python. It allows developers to build web applications quickly and efficiently.
  • Spring Boot is a framework primarily used to develop web applications and microservices (which are large applications being separated into smaller applications, each having its own responsibilities). Spring Boot is built on top of the Java programming language. 

Back-end development databases

A database stores, manages, and retrieves crucial information that is useful to the users or web application. This can include user information, transaction history, and more. Back-end databases can handle retrieving the data or creating new instances in the database. This helps ensure data integrity, security, and scalability. 

Common databases include: 

  • PostgreSQL is a relational database management system. It helps developers build reliable applications and protects user data. It can be scalable, storing any size of data no matter how large or small. Instagram, Uber, and many other companies use PostgreSQL.
  • SQLite is a lightweight relational database. It is a great choice for developers who need a simple relational database. It is common for embedded systems like TVs or mobile devices to use SQLite.
  • MongoDB is a non-relational database that allows developers to store structured or unstructured data. 

Front-end developers 

Front-end developers are responsible for designing and coding the visual aspects of the web application. This includes what users will see and how they will navigate to different pages, plus the graphical design of the application. Front-end developers also implement responsive design, which ensures the application looks appealing and is functional on both desktop and mobile devices. Front-end developers will often collaborate across teams and manage different versions of the application using GitHub. 

Below are brief profiles of common programming languages and tools that many front-end developers use today.

Front-end developer programming languages 

  • Hypertext Markup Language (HTML) is the primary language for building web applications. 
  • Cascading Style Sheets (CSS) is a programming language used for structuring and styling the layout of a web page (for example, the font size of letters on the page).
  • JavaScript is a programming language used to create dynamic web applications. It is commonly used with HTML and CSS. 

Front-end developer tools

  • React is a JavaScript library known for creating dynamic user interfaces for web applications.
  • Angular is a JavaScript framework written in Typescript. It allows users to develop web applications; primarily single page applications.
  • Vue is a popular JavaScript framework used to develop web applications. It is known for its ease of use and flexibility. 

Full-stack developers 

Full-stack developers create and maintain both the front end and back end of a web application. They need skills in both front-end and back-end programming languages and frameworks, plus version control management, server communication, and deployment applications. Full-stack developers need to be proficient in various programming languages and frameworks.

A full-stack development stack may include:

  • HTML
  • CSS
  • JavaScript
  • React
  • Python
  • Flask
  • PostgreSQL

Career Opportunities for Web Developers

The U.S. Bureau of Labor Statistics projects a 25% national growth in software engineering roles through the year 2031. So the future looks bright for those in the field. According to ZipRecruiter, the yearly average salary for a web developer in the United States is $93,848. Depending on the role, industry, and experience you have when you enter the field, the average salary may vary. 

Let’s take a look at the average salaries for the three developer roles we’ve profiled in this article.

Back-end web developer

According to ZipRecruiter, the average salary for a back-end developer in the United States is about $120,000 per year (May 2024). There are a few jobs related to the back-end web developer job category that have even higher average pay. Those jobs include senior Java software engineer, back-end infrastructure engineer, back-end architect, and senior back-end developer. 

As of May 2024, the average salary for a back-end web developer in the U.S. is around 120,000 dollars, according to ZipRecruiter
Source: ZipRecruiter
The average salary for a back-end web developer in the U.S. according to ZipRecruiter (May 2024)

Front-end web developer

According to ZipRecruiter, the average salary for a front-end developer in the United States is about $110,000 per year (May 2024). There are a few jobs related to the front-end web developer job category that have even higher average pay. Those jobs include front-end architect, front-end engineer, and senior front-end engineer. 

As of May 2024, the average salary for a front-end web developer in the U.S. is around 110,000 dollars, according to ZipRecruiter
Source: ZipRecruiter
The average salary for a front-end web developer in the U.S. according to ZipRecruiter (May 2024)

Full-stack web developer

The average salary for a full-stack developer in the United States is about $118,000 per year. There are a few jobs related to the full-stack developer job category that have even higher average pay. Those jobs include full-stack technical lead, stack developer, and Python web developer. 

As of May 2024, the average salary for a full-stack web developer in the U.S. is around 118,000 dollars, according to ZipRecruiter
Source: ZipRecruiter
The average salary for a full-stack web developer in the U.S. according to ZipRecruiter (May 2024)

How to Become a Web Developer

The world of web development offers exciting paths, each with its own set of languages and tools to master. Whether the visual appeal of front-end development, the intricate logic of back-end development, or the well-rounded mastery of full-stack development appeals to you, the first step is building a strong foundation. You’ll need to dive into the core languages that power the web. Front-end developers will conquer the trifecta of HTML, CSS, and JavaScript. Back-end developers will delve into languages like Python and frameworks like Flask. Full-stack developers? You’ll need to absorb it all. 

Flatiron’s Software Engineering Bootcamp can equip you with the skills and knowledge needed to thrive in web development. We’ve helped students from a diverse array of backgrounds—including events management and medicine—successfully change career paths. Take the first step toward a new career today and book a 10-minute call with our Admissions team to learn more. 

Community Code: Contributing to Open Source Projects

Open source software (OSS) is software that’s source code is available to the public for anyone to view, modify, or redistribute. In contrast, Closed Source Software is software that is hidden from the public, and typically comes at a cost. The open source code is usually stored in a repository like Github. Github storage facilitates open collaboration among developers, allowing individuals or organizations to customize and make changes to fit their needs.

The history of open source software began in the 1960s with the free distribution of IBM’s computer, software, and source code. At the time, researchers developing new technologies relied on open source collaboration. This eventually led to the Free Software Movement in the 1980s, which was launched by Richard Stallman when he developed the GNU operating system

By the 1990s open source software continued to be developed, leading to various other open source projects emerging, such as Linux. Today, many open source projects have emerged under open source licenses, and are crucial to advancing technologies in different industries all over the world.

How Does Open Source Software (OSS) Work?

As previously mentioned, open source software is oftentimes stored in a Github repository. The repository will typically contain a license. This license will include terms that define how a user can modify the code or redistribute the software. There are many popular open source licenses used by individuals and organizations. Here are a few examples:

Why Contribute to Open Source Software?

Contributing to open source software is a rewarding way to learn new skills, teach others, and gain valuable experience in any skill. Below are some additional, more in-depth reasons:

Improve existing skills

Contributing to open source projects does not always include coding. Sometimes there are other parts of the project that need updating; for example, there could be errors in the documentation of the project and tutorials, or lack of detailed documentation. Whether you are wanting to improve your existing skills in coding, UI design, or writing, there are problems for you to solve in an open source project.

Improve software used daily

Many open source contributors have used the software they’ve contributed to. When an issue is found in software, you may want to look at the source code to see if it is something that you can update by yourself. This helps prevent any future users from having the same issues, and benefits everyone that uses the software on the next update.

Meet people, find mentors, and teach others

Many people form friendships through collaborating on open source. Open source projects with engaging communities keep people coming back for years, and can lead to long-lasting professional and personal connections. Collaborating with others on open source projects means you will have to ask questions, answer questions, learn from documentation and collaborators, and teach others. The act of learning from and teaching others will be valuable to everyone involved in the project.

Practice people skills

Open source projects offer you opportunities to practice leadership skills by resolving conflicts or organizing and managing teams. 

Gain experience, or a career

All open source projects are publicly available. This means the work you do on an open source project translates to examples of work that demonstrate your technical capabilities. This work can be added to a portfolio that you can then show to potential employers when trying to land a job. 

Flatiron has awarded over $8.6 million in scholarships
Learn about our Access, Merit, and Women Take Tech scholarships and get your career in Software Engineering, UX/UI Product Design, Cybersecurity, or Data Science off the ground!

How to Contribute to Open Source Software

Contributing to open source projects does not mean you always have to code. There are many different ways you can contribute to an open source software project, depending on your strengths, skills, or interests.

Are you a writer?

Below are some ways you can contribute to an open source project if you enjoy writing:

  • Add descriptions of the project or a guide on how to use the project to the project repository. Descriptions and guides are typically posted on the repository’s README. The README is a great way to inform users of the software about what the project is, why it is useful, and how someone can use it. (More information on README can be found in the Elements of an Open Source Project section further down in the article.)
  • Fix typos in the documentation
  • Develop tutorials on how to use the software

Do you like to organize?

Below are some ways you can contribute to an open source project if you are a stickler for organization:

  • Organize the project’s file structure
  • Organize conferences for the project
  • Offer to mentor others on using the software

Do you enjoy solving problems?

If problem solving is your thing, here are some ways you can help out on an open source project:

Roles in Open Source Projects

Every open source software has different communities, and many have their own rules and guidelines on how to contribute. Many also have a variety of roles to fill. Some common roles you will find in an open source project include:


The author is the owner of the product. They assist with the development and maintenance of the product, and can assign roles to members of the community.


The owner can also be the author. The owner possesses ownership of the project’s repository.


The maintainers are responsible for improving the product. 


Contributors add to the project’s source code or documentation. As mentioned earlier, each open source project is different; for example, each project can have its own requirements on contributing to the project or styling the project. The contributors are responsible for following the guidelines that are put in place.

Community member

The community is anyone who uses the product. They are highly valuable members because they can provide feedback and report bugs.

Elements of Open Source Projects

Each open source project is different, but there are some common elements in each one. A few examples include: 

An image displaying the Flask Pallets Project Repository
Flask repository


Every open source software will have a license. You can usually find the license on the GitHub repository. If the product does not have a license then it is not open source. The license protects the contributors and users of the software.


The README tells users and contributors how to get started with the software and how to use the software. The README will often contain example output of the software, or have a guide on how to contribute to the software. (Read GitHub’s documentation to learn more about writing a README, or check out this README template from Make a README.)

Code of Conduct

The code of conduct document establishes expectations for how contributors treat one another and participate in the development of the software. This document aids in creating open source communities that are positive and welcoming environments. (Read the Open Source Guide on creating your code of conduct.)

Contribution Guidelines

The contributor guidelines document contains the requirements on how contributors can contribute to a project and what is expected of them. To learn more about how to contribute to an open source project check out this template for creating open source contributor guidelines.

Open Source Project Tools

Open source communities are all about collaboration, growing skills, sharing ideas, and solving problems. Below are some tools that help open source communities with all of the open source project elements listed above. 

Issue tracker

Image displaying the issue tracker for the Flask project
Flask pallets project issue tracker

The issue tracker is where contributors can keep track of bugs on GitHub, and it also shows how problems are solved during development. Contributors can create an issue on GitHub and other developers can then collaborate and choose to try and fix the problem. This typically requires the contributor to fork the repository (make a copy), find and fix the bug, and then link a pull request to the original repository. Once the problem is solved, the issue is then closed by either the author, owners, or maintainers with access to push changes.

Pull request

Creating a pull request lets other developers know about changes to the repository; primarily, the main branch. Here’s the common workflow:

  1. Fork the original repository: This creates a copy of the original repository in your Github account.
  2. Make changes in your fork: Create a new branch in your forked repository and make changes there.
  3. Create a pull request: Once the pull request is opened, maintainers can then review and discuss the changes before it is merged to the main repository.

(Check out this Atlassian article on branch best practices to learn more.)

Chat Software

Many open source software will have chat rooms available to continue collaboration. Contributors can use these rooms to ask questions about the software or hold conversations about improvements. Some common chat applications are Stack Overflow, Reddit, and Discord.

How to Choose an Open Source Project

Now that you know what an open source project is and what it contains, let’s start thinking about ways to find open source projects to contribute to.

There are several ways to find a project. Think of a website or application that has an issue you wished could be fixed, or a typo in documentation. Instead of submitting an issue, with websites or applications that are open source you can fix that problem yourself.

Many open source projects will have a document called a contributing.md, or a page with path /contribute; for example:


This is where you can find open source software contributing guidelines. Alternative ways to find open source software to contribute to are:

How to make a contribution

Once you have found the project that you would like to contribute to, there are some elements to look for to ensure that it is an open source project. The following criteria will help you find an open source project:

  • Does the project contain a license?
  • When was the last commit?
  • Are there any active issues?
  • How long does it take for maintainers to respond to questions?
  • When was the last issue closed?
  • How many contributors does the project have?
  • Is there a contributing file, or documentation for the process of contributing?

If some of these elements are present, then it is a good open source project to contribute to. Next we will learn more about collaborating and contributing to an open source project via a pull request.

Pull Requests

Let’s talk about pull requests again. A pull request happens when a contributor makes changes to the open source project. In our case this will be software. As long as the project is public, this allows anyone, with any level of experience, to collaborate and find issues in the product or fix typos in documentation. 

Pull request steps

Step 1

Fork the repository. On every public repository there will be a fork button, like in the example below from the flask pallets open source project. As a contributor you will need to create a GitHub account, then select the fork button, and create the fork. This will make a copy of the original repository for you to make changes.

An image demonstrating a GitHub repository for the pallets project
Flask repository

Step 2

Having created your fork, you can download a copy (clone) of the project onto your device. You can use your device’s terminal, or an IDE like VS Code. You will need Git installed on your device in order to clone the project. Read Git Docs to learn more. For instance, let’s look into cloning the Flask project. Here’s how to proceed:

  1. Look for a button labeled “Code.”
  2. Select the code button, and a pop-up window will appear with an HTTPS URL. Copy the URL. 
An image displaying the HTTPS URL for a repository

Step 3

Next, you will need to clone the project to your device using the following command:

An image displaying the git clone command with a URL

Now that you have the project on your local machine, you can make your contributions, whether they be changes in the code or documentation, or the addition of tutorials. When you are ready to submit your changes, complete the following steps.

Step 4

You will need to be on the same path as your project to complete these steps. You can change your paths in the terminal using the cd command. For example, I cloned the flask project to my desktop, and now to make a contribution I will need to change my directory to the flask repository. The following image demonstrates these steps:

An image displaying the change directory command

Step 5

It is best practice to make a branch with your changes. You can accomplish this by using the following command:

An image displaying the git branch command that creates a new branch

Step 6

Next, you will need to switch branches to your newly created branch using the following command:

This image demonstrates switching branches using the checkout command

Step 7

You can either make your changes from the main branch or the new branch. When ready to submit your changes, you will need to first add all your changes using the following command:

This image demonstrates saving all changes using the git add command

Step 8

Next you will need to commit your changes and add a message, like so:

This image shows the changes being saved and adds a message to the commit

Step 9

Now that all changes have been added and committed, you can push the changes up to GitHub using the following command:

This image demonstrates pushing changes to any origin on Github

Step 10

In my case it would look like this:

This image demonstrates pushing changes to my branch

Finally, you can now make a pull request that describes the changes you have made. You can then link your forked repository to the pull request, and a maintainer of the software can then approve or deny the changes. If it is approved the maintainer will then merge the changes into the main branch. If the pull request is denied the maintainers may need some changes from you. This is the common process you will see when it comes to collaborating in open source software.

Ready to reap the rewards of contributing? Now that you’ve explored open source software and understand how you can get involved, let’s summarize the benefits.

  • Sharpen your skills, no matter your level. Open source contributions empower you to refine existing skills and explore new ones.
  • Find a project that fits you. The beauty of open source is its variety. There are projects for everyone, even if coding isn’t your forte.
  • Build your career. Contributions to open source projects showcase your talent, helping you forge connections, friendships, and a strong reputation within the developer community.

Learn to Code at Flatiron School

Ready to turn tech inspiration into action? Our Software Engineering Bootcamp equips you with in-demand skills for a career in a field with a projected 25% national growth in roles through 2031. Download the syllabus to explore the curriculum or book a call with our Admissions team to learn more. See for yourself why Flatiron is your launchpad to a rewarding future in tech.

Anslie Brant: From Nanny to Operations Analyst

Anslie Brant (she/they) is a recent Flatiron School graduate who just landed their dream job in the tech industry! Their story is one of determination, resilience, and the power of finding the right educational path. In this blog, we’ll follow Anslie’s journey, from their pre-Flatiron experience to their exciting new role in the tech world, all through their own words.

Before Flatiron: What were you doing and why did you decide to switch gears?

Anslie, like many others, found themselves navigating the twists and turns of life’s path. “I was a computer science student at university,” she explained, but due to various circumstances, Anslie wasn’t able to finish their degree. This led to a period of working odd jobs, facing the insecurity that often comes with such positions, especially during the COVID-19 pandemic.

However, the desire for a tech career never faded. “I knew I still wanted to pursue software development [and the] tech field in general,” Anslie says. Finding stable work as a nanny provided the space to explore different options. Inspired by friends who had successfully transitioned into tech through bootcamps, Anslie began researching this route. She discovered a passion for full-stack development, a field that allows Anslie to “combine my creative side and analytical side to be a well-rounded front- and back-end developer.”

Anslie’s story reflects a common thread among those drawn to tech careers: a lifelong fascination with technology. “I began playing video games early in life,” they share, “and this interest just never stopped.” Building their own PC for various purposes – work, education, and even streaming – solidified their desire to be part of the tech world.

During Flatiron: What surprised you most about yourself and the learning process during your time at Flatiron School?

Having had a taste of computer science in college, Anslie knew the traditional university route wasn’t the right fit. “I wanted to learn HOW to code and apply it,” they explain, “and in college, I hadn’t even gotten my hands on real-life applications yet.” Flatiron School offered a different approach, one that emphasized practical application and real-world skills.

Anslie’s journey at Flatiron School wasn’t without its challenges. However, their story highlights Flatiron’s focus on student success. Anslie reflects positively on the supportive Admissions experience and even received a scholarship. “The fact there was a scholarship option for Women in STEM as well as based on financial need was enticing,” they say.

Looking back, Anslie is most proud of simply graduating. “I was very disappointed in not finishing the traditional university route,” they confess. Flatiron provided the opportunity to overcome that disappointment and achieve their goals. “I was able to jump right in, gain real industry experience, and get my foot in the door of tech in a very tough state at the moment.”

After Flatiron: What are you most proud of in your new tech career?

With grit and determination, Anslie Brant landed a role as an Operations Analyst at TSYS Global Payments. “I am very proud to have landed a tech-adjacent role for a fintech company,” Anslie says. This new role offers not only amazing benefits and growth opportunities but also a significant increase in income.

The job search process wasn’t easy. It took four months of dedicated effort, “never stopping networking, cold messaging on LinkedIn, sending applications to all kinds of tech jobs, and practicing interview questions,” as Anslie describes it. Their perseverance paid off, and they landed a coveted position in a competitive industry.

The transformation is remarkable. “I went from being a nanny with past experience in food service, retail, and hospitality, with no corporate experience, to working a technical role in a fintech corporation,” Anslie reflects. They attribute their success not only to their own hard work but also to Flatiron School and Career Coach, Raffi Sarafian. “I was complimented on my etiquette and professionalism in my interviews which I can only attribute to my Coach and resources provided by Flatiron as I genuinely had not a clue!”


Anslie’s story is a testament to the power of finding the right educational path and the transformative potential of Flatiron School’s immersive bootcamp. 

Inspired by Anslie’s Story? Ready to take charge of your future?

Apply Now to join other career changers like Anslie Brant in a program that sets you apart from the competition. Read more stories about successful career changes on the Flatiron School blog.

The Power of Variables: Storing and Using Information

One of the most important foundational building concepts in programming is variables. Variables are a way to make a computer remember values. A variable is a label to which a value can be assigned.

Variables allow programmers to give meaning to values and use those values throughout the program easily. For example, the number 238900 doesn’t mean anything but if we label it as “the distance between the Moon and the Earth” it’s easier to reference. We don’t have to remember the exact value as we can look it up using the phrase “distance between the Moon and the Earth.”

Here’s how we would use a variable in Python:

Python code declaring a variable called “distance_between_moon_and_earth” and printing it to the console.


Python code showing the integer value “238900.”

We can use “_” (underscore) to make big numbers easier to read in Python. Notice that we’re also using the “_” to separate words in the variable name.

Variable Naming Conventions

It is important to follow consistent guidelines when naming variables. The projects you work on will likely have their own guidelines. (Check out Google’s Python style guide as an example.)

The following are common Python variable naming conventions used in the industry:

  • Variable names can only contain letters, numbers, and underscores (_).
  • They can only start with a letter or an underscore (greeting1 and _greeting1 are valid but 1greeting is not).
  • Variables are case-sensitive (greeting and Greeting are separate variables).
  • Multiple words must be separated using _ (my_birthday, number_of_people). This convention is called snake_case.
  • Variable names must be meaningful (max_speed instead of m).

Visualizing Computer Memory

Whenever we ask the computer to represent a string, number, or boolean it creates the representation in its memory. You can think of computer memory as a giant container that can store information for the duration of a program’s execution.

At the start of program execution, the computer’s memory is empty. We can visualize it like this:

Blank rectangle representing empty memory

Now let’s run some code and visualize how the memory will change during execution:

Python code with 4 print statements where each line prints a value of different data type.

For each of the values, a representation will be created in the memory during execution.

Rectangle with various primitive values

Once the program completes execution, the memory will be empty again.

Note that if we had two print(1) statements, there would still be only a single representation of the integer 1. This is the case for strings and booleans too.

Variable Declaration and Assignment

Let’s look at how to create a variable again:

Python code declaring a variable called “cat_name” and assigning the value “Fifi” to it.

There are three parts to this line:

  1. cat_name is the variable name.
  2. = is an assignment operator.
  3. 'Fifi' is an expression that produces the value Fifi of type str.

So this is the general structure:

General expression for declaring a variable name and assigning an expression to it.
  • The right side of the = operator is evaluated first.
  • The value produced by the expression evaluation is then assigned to the variable name or label.

The line cat_name = 'Fifi' is usually verbalized as “declare a variable called cat_name and assign the value ‘Fifi’ to it.

Visualizing declaration and assignment

We are going to visualize the following line:

Python code declaring a variable called “cat_name” and assigning the value “Fifi” to it.

First, the computer evaluates the expression which in this case produces the string 'Fifi' and stores it in the memory.

Rectangle with the value”Fifi”

The computer would then declare the variable with the given name. Notice that the string is in '' while the variable name is not.

Rectangle with the variable label “cat_name” and the value “Fifi”

Finally, the computer makes the variable name point to the value (i.e., it assigns the value to the variable label).

Rectangle showing an arrow going from the variable label “cat_name” to the value “Fifi.”

Variable Access

We’ve seen how a computer declares variables and assigns values to them. Now we will look at what happens when the computer accesses a variable.

Here’s the code we will be working with:

Python code declaring a variable called “cat_name”, assigning the value of “Fifi” to it, and printing it to the console.

When a computer sees a variable label it checks its memory for the label. If the label exists, the value that the label points to is used by the computer.

We can visualize this by checking the memory diagram and following the arrow from the variable label (cat_name) to the value (’Fifi’).

Variable Reassignment

Variable values can be changed during the execution of the program. For example:

Python code declaring a variable called “current_year” and assigning the value of “2023” to it. The value is reassigned to “2024” and printed to console.

The first line will result in the following memory state:

Rectangle showing an arrow from the variable label “current_year” to the integer value 2023.

On the second line, the computer will look up the current_year label in its memory and display the value 2023.

With the third line, a few things happen:

  • The computer creates the representation of 2023 in its memory (remember the right-hand side of the = operator is evaluated first). 
Rectangle showing an arrow from the variable label “current_year” to the integer value 2023 and the integer value 2024 without anything pointing to it.
  • The current_year label arrow is pointed to the 2024 representation.
Rectangle showing an arrow from the variable label “current_year” to the integer value 2024 and the integer value 2023 without anything pointing to it.
  • Since no variables are pointing to the 2023 value anymore, it gets removed from memory.
Rectangle showing an arrow from the variable label “current_year” to the integer value 2024.

On the 4th and final line, the computer checks its memory for the current_label again but this time it’s pointing to a new value (2024).

As a reminder, this mental model works for strings and booleans too!

Hopefully you now have an understanding of how to visualize variable declaration and assignment. These visualizations can also be used for reference type values such as arrays and objects. Whenever you’re using variables, make sure to follow a consistent guideline and identify what value a variable is referencing. With these foundations, you will be able to effectively use variables in any programming language.

Make a Software Engineering Career Change at Flatiron

Our Software Engineering Bootcamp offers hands-on training, expert technical coaching, and real-world projects designed to launch your career in tech. Don’t miss this opportunity to join a vibrant community of developers and unlock limitless possibilities. Apply now and fast-track your path to success in the dynamic field of software engineering.

From Script to Screen: Introduction to Web Development Basics

In the vast expanse of the digital landscape, transforming a simple idea into a vibrant, fully operational website is an adventure akin to an explorer venturing into new territories. Just as explorers rely on their compass, map, and vessel to navigate uncharted territories, developers embarking on their own journeys must master the tools of Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript. These foundational elements allow you to successfully navigate from an initial concept to the final destination, where your creations come to life on the screen. As you explore and master these essential tools, you’ll find yourself capable of navigating the complexities of the web with confidence and creativity, and be ready to turn your visions into reality. Let’s dive into learning about web development basics. 

HTML Basics: Charting the Journey

HTML is the standard markup language used to create and structure content on the web. It consists of elements known as tags, which define headings, paragraphs, links, images, buttons, and other content elements. These tags are the building blocks of web development—the first script in bringing your digital visions to screen. Here’s a basic example of what HTML looks like:

A basic HTML example

Taking a look at this, you may notice how each element serves a specific purpose, much like the components of a map guiding an explorer. The <!DOCTYPE html> declaration defines the document type and version of HTML. The <html> element is the root of an HTML document, encapsulating all content. Within it, the <head> section contains meta-information like the <title> of the page, which appears in the browser’s title bar or tab.

The <body> houses the content visible to users: headings, paragraphs, links, and more. For instance, <h1> tags denote main headings, significantly larger in size for emphasis, while <p> tags are used for paragraphs, marking the text body. This structure is not just for looks. It’s about creating a hierarchy and organizational flow that guides the user through the content, in a consistent and accessible way.

Expanding Your HTML Toolkit

Beyond the basics, HTML offers many elements to enrich your web pages, each serving specific purposes:

Links (<a>): The cornerstone of the web, links allow you to navigate from one page to another or to resources within the same page. They are the pathways connecting different territories of the digital world.

A tag example

Images (<img>): Images bring visual appeal and context to your content, acting as windows to the world you’re creating.

An image tag example

Lists (<ul>, <ol>): Whether unordered (<ul>) or ordered (<ol>), lists are essential for structuring information in an easily digestible format.

An unordered list example

Forms (<form>): Forms are your way of gathering input from the voyagers of your site, be it for newsletter subscriptions, feedback, or inquiries.

A form tag example

Best Practices in HTML

As you chart your journey through web development, adhering to best practices in HTML is crucial.

Semantic HTML

Use HTML elements according to their intended purpose. Refer to documentation on MDN to learn how to choose the right tags for the job. As you become more familiar with HTML, you should know when to use elements like <article>, <section>, and <aside> to structure your content meaningfully.


Ensure your web pages are accessible to all users, including those with disabilities. Use alt attributes for images and structure your content for screen readers. MDN is also an excellent resource for accessibility information.

HTML: Laying a Foundation

Understanding HTML is the first step in the web development journey, allowing you to lay down the foundation upon which all else is built. As you progress, remember that each tag and element is a step towards bringing your digital visions to life. From script to screen, HTML is your map and compass, guiding you through the intricate landscape of web development.

CSS Basics: Styling the Journey

CSS introduces aesthetics to the journey of web development. It’s the language used to style HTML documents, dictating how elements should appear on the screen. CSS basics cover the use of selectors, properties, and values to design layouts, set fonts, and apply colors, transforming the bare-bones structure into a visually appealing experience.

Consider this brief CSS example:

A basic Cascading Style Sheet example

In this snippet, the body selector targets the entire body of the HTML document, setting a universal font, removing default margins and padding, and applying a base text color. The h1 selector then specifically targets all <h1> elements, assigning them a distinct color. This is just the beginning of what CSS can accomplish.

Selectors: The Starting Point

Selectors are the means by which CSS targets HTML elements to apply styles. Beyond targeting element types like h1, CSS allows for more complex targeting using classes, IDs, and attributes, enabling precise control over the styling of individual elements or groups of elements.

Properties and Values: The Building Blocks of Style

CSS properties are the specific aspects of elements that you can style. Some examples of these are color, font family, margin, and padding. Each property is given a value, which dictates how that property should be displayed on the page. For example, color: #1167b1; sets the text color of the selected element to a specific shade of blue.

Layouts and Positioning: Structuring Your Space

One of the most powerful aspects of CSS is its ability to control the layout and positioning of elements. With properties like display, position, flexbox, and grid, you can define how elements are organized and interact with each other on the page. This allows for the creation of complex, responsive designs that look great on any device, even if users adjust their window sizes.

A Cascading Style Sheet positioning example

In this example, the .container class is used to create a flex container that centers its children both horizontally and vertically.

Styling Beyond the Basics: Transitions and Animations

CSS also offers the ability to add transitions and animations, bringing interactivity and motion to your designs. Transitions allow styles to change smoothly over a specified duration, while animations enable more complex sequences of style changes.

A Cascading Style Sheet animation example

This code snippet demonstrates a simple transition effect, changing the background color of a button smoothly when you hover the mouse over it. While it’s simply to learn a few basics on CSS animations, the sky’s the limit for what you can do with it, given dedicated practice and study.

Responsive Design: Adapting to Screens

A critical aspect of modern web design is responsiveness, ensuring that web pages look good and function well on a variety of devices and screen sizes. CSS facilitates responsive design through media queries, which apply styles based on specific conditions like screen width.

A CSS media query example

This media query adjusts the font size for screens smaller than 600 pixels, improving readability on mobile devices. You can tailor your styling using multiple different media queries for different sizes.

Mastering CSS requires a lot of experimentation and trial and error. It’s essential for anyone looking to make their mark in web development. It allows you to bring your HTML structures to life with style, creating engaging and effective web experiences. As you continue your journey in web development, it will help you turn your creations into beautiful works of art.

JavaScript Basics: Bringing the Adventure to Life

JavaScript adds interactivity and functionality to the web development voyage. It’s a programming language that allows developers to implement complex features on web pages. From dynamic content updates to interactive maps and animated graphics, JavaScript basics are about breathing life into the static pages created with HTML and CSS.

Here’s a one-line example of some JavaScript code:

A basic JavaScript example

This line of JavaScript finds an HTML element with the id “demo” and changes its content to “Hello, World!” This is how JavaScript can manipulate the content of a web page. This allows you to write scripts that automatically change content in response to things users are doing—turning a static document into something truly interactive. As you delve into this part of your journey, programming fundamentals become a key element for you to develop, and begin to apply.

Variables and Data Types

At the heart of JavaScript are variables and data types. Variables are used to store information that can be referenced and manipulated by the program. JavaScript supports various data types, including numbers, strings, and arrays, allowing for the storage and manipulation of a wide range of information.

A JavaScript variable example

Functions: The Building Blocks of Interactivity

Functions are fundamental to JavaScript, allowing you to encapsulate code for reuse. They can take inputs, process information, and return outputs. Functions are what make it possible to add interactivity to web pages, responding to user actions such as clicks and keystrokes, and even scrolling.

A JavaScript function example

Events: Reacting to User Actions

JavaScript’s power lies in its ability to react to user events, such as clicks, mouse movements, and keyboard input. By attaching functions to these events, you can create interactive and dynamic user experiences.

A JavaScript event listener example

The Document Object Model (DOM)

The Document Object Model (DOM) is a programming interface for web documents. It represents the page so that programs can change the document structure, style, and content. JavaScript uses the DOM to interact with and manipulate web pages dynamically. Think of this as a virtual representation of your HTML tag elements that JavaScript is able to reference and interact with more directly.

A Document Object Model example

Asynchronous JavaScript: Enhancing User Experience

Asynchronous JavaScript, including Promises and async/await, allows for performing long network requests without blocking the main thread. This is crucial for creating smooth, user-friendly web applications.

An asynchronous JavaScript example

JavaScript: Building Off the Basics

JavaScript is the spirit of modern web development, infusing static HTML and CSS with the breath of life. It enables the creation of rich, interactive web experiences that engage users. As you delve deeper into JavaScript basics, you’ll discover a world of possibilities for innovation and creativity in web development. This is where the adventure really starts and can go in almost any direction. Remember, JavaScript is not just a programming language; it’s a tool for bringing your digital adventures to life.

Charting the Course: Building Websites

With an understanding of HTML, CSS, and JavaScript, the journey from script to screen in web development becomes a tangible reality. Building websites is the ultimate adventure, a process that combines creativity with technical skill to produce digital experiences that engage and delight users.

Introduction to Web Development: The First Step

As you approach your introduction to web development and learn the essential tools of the trade, you’re preparing to chart your course for your journey. This involves understanding the web development basics, familiarizing yourself with the tools and technologies, and starting to think like a developer. This takes practice above all, and collaboration with others can also be a big help. Gaining these skills and foundational knowledge is crucial for navigating the challenges and opportunities of the digital landscape.

“Script to screen” web development is about using a creative and technical process to turn your ideas into digital realities for all to see. It’s about writing the code that brings designs to life, ensuring that every element works in harmony to create a seamless user experience. This phase of the journey emphasizes the importance of a solid understanding of web development basics, as it’s the skill that translates vision into reality. 

Start with writing some documents in HTML, to organize the content and be sure to take advantage of semantic elements for their specific purposes. Then add CSS to customize and enrich its appearance. Finally, add JavaScript to provide some interactivity and functionality. The more you repeat this process, the more complex and beautiful your creations will become.

Web Development Basics: Conclusion

The journey from script to screen in web development is both challenging and rewarding. It offers the opportunity to create, innovate, and impact the digital world in meaningful ways. By mastering the web development basics of HTML, CSS, and JavaScript, you equip yourself with the tools needed to navigate this journey successfully. As you embark on this adventure, remember that the path from concept to creation is a journey of continuous learning and discovery. The standards and trends on the web are constantly evolving, and so too are the possibilities for those who dare to explore it.

Gain an Education in Web Development at Flatiron School

You can learn HTML, CSS, JavaScript and more in Flatiron’s Software Engineering Bootcamp. Our graduates have been hired by such companies as Microsoft, Intel, Apple, and Spotify. Take the leap today and apply, or schedule a 10-minute call with our Admissions team!

The Logic Within: Demystifying Conditional Statements and Loops

Simple programs are run sequentially. Instructions are written line by line and the computer executes them exactly as written every time. However, for complex programs we have to make decisions based on various parameters. For example, a weather app shows different visuals based on the temperature or time of day. We looked at a few foundational programming concepts in a previous article. In this article, we’ll be taking a look at two more coding building blocks: conditional statements and loops.

Both conditionals and loops are essential in creating complex programs. They allow us to create branches in our programs or automate certain types of instruction. Almost every programming language you learn will have syntax for conditional statements and loops.

In this post, we will be exploring the following:

  • If statement 
  • If-Else statement
  • For loop

If Statement

Code will run sequentially unless specified otherwise. If there are any errors, the program might show an error or retry the instruction that caused the error. But even then, the code would still be considered “unconditional.” Errors are exceptional cases and are not part of the regular program flow. “Unconditional” code refers to code that is written in a sequential manner without any logic applied. Wouldn’t it be great if we could say “If this is true . . . do this thing first”? Well, it turns out, we can! Statements and logic like that are called conditionals, where we modify the flow of the program with some logic.

Consider a program in JavaScript where we want to alert a student if he or she passed a test:

If statement example in JavaScript

The if statement allows us to specify a “condition.” In JavaScript, an if statement is immediately followed by an open parenthesis (, a “conditional clause,” and a close parenthesis ). The conditional clause is any expression that can evaluate to either “true” or “false.”

In this case, either the grade is greater than or equal to 70, or it’s not. If it’s greater than or equal to 70, then the program will execute the content of the if block. If the grade is less than 70, then the program will not execute the content of the if block. Consider the following flowchart:

program flow diagram for if statement

If-Else Statement

An if statement can be followed by an else statement. When an else follows an if, its content will be executed whenever the conditional clause of the if statement is not true. It should be noted that an if statement does not need to be followed by an else statement, as we have seen in the example above. But if we are to have an else statement, the syntax would look like this:

If-else statement example

Consider the following flowchart to summarize how an if-else statement works:

program flow diagram for if-else statement

if-else statements are a good option to use when we have exactly two cases. In the example we’re working with, a student will either pass or fail. Another example of having exactly two cases would be determining if a number is even or odd.

For Loop

We can loop through the same block of code multiple times given some conditions. Loops are helpful if we want to execute the same statements over a number of iterations. Consider the following pseudocode:

Pseudocode showing print outputs for the numbers 1 through 100

Notice how we would have to write a hundred console.log statements if we were to write out this pseudocode in JavaScript. But the pattern seems to be that we are executing a print statement a hundred times and just changing the value of what is printed. While this code is rather simplistic in that it is only one line of code that we want to repeat over and over, imagine if it was several lines of code that we wanted to repeat over and over? This could cause a maintenance nightmare of having to update repeated lines of code if we just want to make one little change! This is a good case to implement a loop that will save us from several copy-paste issues when developing and maintaining.

The for loop is a way to indicate that we want to go through a section of code multiple times. The for loop takes multiple parameters:

  1. An initializing statement that is run once before the content of the for loop.
  2. A conditional that is evaluated once before each run through the for loop and must be true in order for the content of the for loop to be executed.
  3. An update statement that is run once after each run through the for loop.

The syntax is as follows:

For loop syntax in JavaScript

This kind of loop is very well suited in cases where we know in advance how many times we want to go through a specific set of instructions. Consider the following flowchart:

program flow diagram for a for loop

Let’s consider that we want to print a message to the console five times. We would write the following code:

for loop code that runs five times

Let’s break down what this for loop does:

  1. Define a variable named i and initialize it to 0.
  2. Establish that the code inside the for loop code block should run as long as i is less than 5.
  3. Establish that the value of i should be incremented by one every time the loop is executed.

We can revise our flowchart from before to reflect this example:

program flow diagram for a for loop example

This will produce the following output:

Code output for the previous for loop code

Conditional statements and loops will allow you to develop programs that can react to your user’s choices and automate or streamline various workflows. You can create delightful, interactive experiences for users by leveraging different control flow strategies.

Learn Software Engineering at Flatiron School

Our Software Engineering Bootcamp allows students to gain an education in the field in as little as 15 weeks. You can apply today or book a call with our Admissions team to learn more! And if you are interested in seeing the types of projects you can work on at Flatiron, attend our Final Project Showcase.

Enhancing Your Tech Career with Remote Collaboration Skills

Landing a career in the tech industry requires more than just technical/hard skills; it requires soft skills like effective communication, adaptability, time management, problem-solving abilities, and remote collaboration skills. Remote collaboration is especially key for those who work in tech; according to U.S. News & World Report, the tech industry leads all other industries with the highest percentage of remote workers.

At Flatiron School, we understand the importance of these skills in shaping successful tech professionals. Hackonomics, our AI-focused hackathon event happening between March 8 and March 25, will see participants sharpen remote collaboration skills (and many others) through the remote team-based building of an AI-driven personal finance platform. We’ll reveal more about Hackonomics later in the article; right now, let’s dive deeper into why remote collaboration skills are so important in today’s work world.

Mastering Remote Collaboration Skills

Remote collaboration skills are invaluable in today’s digital workplace, where teams are often distributed across different locations and time zones. Whether you’re working on a project with colleagues halfway across the globe or collaborating with clients remotely, the ability to effectively communicate, problem-solve, and coordinate tasks in a remote work setting is essential for success. Here are some other key reasons why this skill is becoming so important. 

Enhanced Productivity and Efficiency

Remote collaboration tools and technologies empower teams to communicate, coordinate, and collaborate in real-time, leading to increased productivity and efficiency. With the right skills and tools in place, tasks can be completed more quickly, projects can progress smoothly, and goals can be achieved with greater ease.

Flexibility and Work-life Balance

Remote work offers unparalleled flexibility, allowing individuals to balance their professional and personal lives more effectively. However, this flexibility comes with the responsibility of being able to collaborate effectively from anywhere, ensuring that work gets done regardless of physical location.

Professional Development and Learning Opportunities

Embracing remote collaboration opens doors to a wealth of professional development and learning opportunities. From mastering new collaboration tools to honing communication and teamwork skills in virtual settings, individuals can continually grow and adapt to the evolving demands of the digital workplace.

Resilience in the Face of Challenges

Events such as the COVID-19 pandemic—and the massive shift to at-home work it caused—has highlighted the importance of remote collaboration skills. When faced with unforeseen challenges or disruptions, the ability to collaborate remotely ensures business continuity and resilience, enabling teams to adapt and thrive in any environment.

Join Us for the Hackonomics Project Showcase and Awards Ceremony

Come see the final projects born out of our Hackonomics teams’ remote collaboration experiences when our Hackonomics 2024 Showcase and Awards Ceremony happens online on March 28. The event is free to the public and offers those interested in attending a Flatiron School bootcamp a great opportunity to see the types of projects they could work on should they enroll.

The 8 Things People Want Most from an AI Personal Finance Platform

Great product design is one of those things you just know when you see it, and more importantly—use it. It’s not just about being eye-catching; it’s about serving a real purpose and solving a real problem—bonus points if you can solve that problem in a clever way. If there ever was a time to build a fintech app, that time is now. The market is ripe, the problems to solve are plenty, and the tools and resources are readily available. Flatiron School Alumni from our Cybersecurity, Data Science, Product Design, and Software Engineering bootcamps have been tasked to help me craft Money Magnet, an AI personal finance platform that solves common budget-making challenges. They’ll tackle this work during Hackonomics, our two-week-long hackathon that runs from March 8 to March 25.

There is one goal in mind: to help individuals and families improve their financial well-being through an AI financial tool.

A loading screen mockup for AI personal finance platform Money Magnet
A loading screen mockup for AI personal finance platform Money Magnet

My Personal Spreadsheet Struggle

The concept for Money Magnet sprang from personal frustration and mock research around user preferences in AI finance. As a designer, I often joke, “I went to design school to avoid math.” Yet, ironically, I’m actually quite adept with numbers. Give me a spreadsheet and 30 minutes, and I’ll show you some of the coolest formulas, conditional formats, and data visualization charts you’ve ever seen.

Despite this, in my household, the responsibility of budget management falls squarely to my partner. I prefer to stay blissfully unaware of our financial details—knowing too much about our funds admittedly tends to lead to impulsive spending on my part. However, occasionally I need to access the budget, whether it’s to update it for an unexpected expense or to analyze historical data for better spending decisions.

We’re big on goal-setting in our family—once we set a goal, we stick to it. We have several future purchases we’re planning for, like a house down payment, a new car, a vacation, and maybe even planning for children. 

But here’s the catch: None of the top AI financial tools on the market incorporate the personal finance AI features that Money Magnet proposes bringing to the market. Families need an AI personal finance platform that looks into our spending patterns from the past and projects into the future to tell users when the budget gets tighter. This product should be easy to use with access to all family members to make changes without fear of wrecking the budget.

For more context, each year, my partner forecasts a detailed budget for us. We know some expenses fluctuate—a grocery trip might cost $100 one time and $150 the next. We use averages from the past year to estimate and project those variable expenses. This way, we manage to live comfortably without having to scale back in tighter months, fitting in bigger purchases when possible, and working towards an annual savings goal.

Top financial apps chart from Sensor Tower
Top financial apps chart from Sensor Tower

But here’s where the challenge lies: My partner, as incredible as he is, is not a visualist. He can navigate a sea of spreadsheet cells effortlessly, which is something I struggle with (especially when it comes to budgeting). I need a big picture, ideally represented in a neat, visual chart or graph that clearly illustrates our financial forecast.

Then there’s the issue of access and updates. Trying to maneuver a spreadsheet on your phone in the middle of a grocery store is far from convenient. And if you make an unplanned purchase, updating the sheet without disrupting the formulas can be a real hassle, especially on a phone. This frustration made me think, “There has to be a better solution!”

Imagining the Ultimate AI Personal Finance Platform

Imagine an AI personal finance platform that “automagically” forecasts the future, securely connects to your bank and credit cards to pull transaction histories, and creates a budget considering dynamic and bucketed savings goals. This dream app would translate data into a clear dashboard, visually reporting on aspects like spending categories, monthly trends in macro and micro levels, amounts paid to interest, debt consolidation plans, and more.

It’s taken eight years of experiencing my partner’s budget management to truly understand a common struggle that many other families in the U.S. face: Advanced spreadsheet functions, essential in accounting and budgeting, are alien to roughly 73% of U.S. workers.

The extent of digital skills in the U.S. workforce according to OECD PIAAC survey data. Image Source: Information Technology and Innovation Foundation
The extent of digital skills in the U.S. workforce according to OECD PIAAC survey data. Image Source: Information Technology and Innovation Foundation

Money Magnet aims to automate 90% of the budgeting process by leveraging AI recommendations about users’ personal finances to solve eight of the key findings outlined in a mock research study based on some of the challenges I had faced when developing a budget of my own.

Features to Simplify Your Finances

This dream budgeting tool is inspired by my own financial journey and the collective wish list of what an ideal personal finance assistant should be. Here’s a snapshot of the personal finance AI features that aims to position Money Magnet as one of the top AI financial tools on the market:

  1. Effortless Onboarding: Starting a financial journey shouldn’t be daunting. Money Magnet envisions a platform where setting up accounts and syncing banking information is as quick and effortless as logging into the app, connecting your bank accounts, and establishing some savings goals (if applicable).
  2. Unified Account Dashboard: Juggling multiple banking apps and credit card sites can be a circus act, trying to merge those separate ecosystems as a consumer is nearly impossible. Money Magnet proposes a unified dashboard, a one-stop financial overview that could declutter your digital financial life.
  3. Personalized AI Insights: Imagine a platform that knows your spending habits better than you do, offering bespoke guidance to fine-tune your budget. Money Magnet aims to be that savvy financial companion, using AI to tailor its advice just for you.
  4. Vivid Data Visualization: For those of us who see a blur of numbers on statements and spreadsheets, Money Magnet could paint a clearer picture with vibrant graphs and charts—turning the abstract into an understandable, perceivable, engaging, and dynamic visual that encourages you to monitor the trends.
  5. Impenetrable Security: When dealing with informational and financial details, security is non-negotiable. Money Magnet will prioritize protecting your financial data with robust encryption and authentication protocols, so your finances are as secure as Fort Knox.
  6. Intelligent Budget Optimization and Forecasting: No more cookie-cutter budget plans that force your spending to fit conventional categorization molds! Money Magnet will learn user preferences in AI finance and forecast from your historic spending, suggesting ways to cut back on lattes or add to your savings—all personalized to improve your financial well-being based on your real-world spending and forecast into the future to avoid pinch-points.
  7. Smooth Bank Integrations: Another goal of Money Magnet is to eliminate the all-too-common bank connection hiccups where smaller banks and credit unions don’t get as much connectivity as the larger banks, ensuring a seamless link between your financial institutions and the app.
  8. Family Financial Management: Lastly, Money Magnet should be a tool where managing family finances is a breeze. Money Magnet could allow for individual family profiles, making it easier to teach kids about money and collaborate on budgeting without stepping on each other’s digital toes or overwriting a budget. It’s important for those using Money Magnet to know it can’t be messed up, and that any action can always be reverted.

See the Money Magnet Final Projects During Our Closing Ceremony on March 28

Attend the Hackonomics 2024 Showcase and Awards Ceremony on March 28 and see how our participating hackathon teams turned these eight pillars of financial management into a reality through their Money Magnet projects. The event is online, free of charge, and open to the public. Hope to see you there!

Software Engineering in the Age of AI

The landscape is shifting. The reality is that artificial intelligence (AI) is fundamentally altering everything—upending industries, redefining roles, and transforming how we approach everyday tasks like writing emails and touching up selfies. In the last three years, Generative AI models have advanced significantly, making tools like OpenAI’s ChatGPT accessible to just about everyone for optimizing workflows and enhancing productivity. This integration of AI across such a vast array of platforms signifies a new baseline for business operations and innovation. 

It’s hard to miss—almost every headline about tech concerns AI’s potential impact on the future. However, no one has a magic ball to predict the norm of the future. Executives don’t understand AI or their team’s proficiency with AI tools, so they are uncertain about how to implement AI in their organizations. Analysts and futurists are making educated guesses about the effects of AI. Some are predicting the automation of everything. Some are predicting the creation of a new era of human flourishing. It’s confusing, leaving us with significant uncertainty about the potential and limitations of AI technologies and the ways specific industries and jobs may change.

This article discussed the continued importance of software engineering in the AI era and how AI can complement and expand these skills in the coming years.

Is Software Engineering Still a Viable Career Path?

In short, yes. The tech industry is constantly changing and adapting. The creation of personal computers was a massive technological shift that was met with trepidation and concern and resulted in an enormous explosion in products and jobs. Frameworks, testing, and automation techniques have evolved for decades, creating significant productivity gains. The truth is that AI-assisted coding has been available to developers for years, and most of the potential gains of emerging technologies aren’t far out of line with the work that has happened in the past. 

Despite all of this, software engineering skills remain essential. The demand for skilled engineers is expected to grow by 25% in the next 5-6 years. That growth is driven by digital transformation and AI integration across all sectors. Software engineering is evolving to accommodate AI, necessitating a shift in skills while remaining foundational to the development of digital products. Its foundational pillars—programming, problem-solving, creativity, and complex system design—are as relevant as ever.

Programming Proficiency & Application Development

The fundamental role of coding in software engineering isn’t likely to change any time soon. Python and JavaScript are pivotal languages that every programmer will need to know. These languages support AI and ML projects and the frameworks that power modern applications. 

Python libraries, like TensorFlow, NumPy, Keras, and Scikit-learn, are foundational tools for AI and machine learning development. JavaScript has front-end and back-end development applications through frameworks like Node.js, Vue, and React, bringing AI capabilities to web interfaces. As AI integration deepens, the essence of coding as a skill—conceptualizing and creating digital solutions—will be invaluable. The development of future products will require deep programming and product development knowledge.

We teach these languages in most of our programs because of the popularity and versatility of Python and JavaScript, but they aren’t the only viable options. Languages like Java, PHP, and C# are also highly utilized in modern programs. Whatever language you learn, coding skills transcend specific languages; by learning to code, you learn problem-solving, system design, and adaptability. With AI tools automating tasks and generating code, software engineers can focus on higher-level problem-solving and creativity. This partnership with AI enhances efficiency and highlights the importance of programming knowledge. Engineers need to understand code to oversee AI’s contributions effectively, ensuring applications are efficient, scalable, and ethical.

Understanding AI and ML Principles

Engagement with AI projects is growing—a look at Github’s annual report shows a massive spike in AI-related projects. Developers are adapting to incorporate these new technologies in their toolkits. Software engineers must understand how to integrate AI into their projects, extending beyond traditional applications to include AI-driven functionalities like image recognition and language translation.

Knowledge of AI principles will be critical for addressing complex challenges. Not every engineer will need to be a data scientist, but familiarity with AI and ML concepts will become more essential with time. This knowledge is vital for software engineers in two ways:

  1. The ability to implement existing AI models. You must know how to use AI tools and incorporate them into products. For example, programming knowledge will help you interact with APIs, but you’ll also need to understand the model parameters and how to tune them to get the output you want. This takes some familiarity with AI concepts and a working knowledge of manipulating models for a desired outcome. Your knowledge of Python and development practices will be helpful here, as many of the most advanced AI and machine learning models are accessible via Python.
  2. Understanding how these technologies can be leveraged to solve real-world problems. This will soon become a real differentiator. Understanding models well enough to leverage them for specific circumstances will be critical in the future. Most of the recent discussion has been around Generative AI language models. Still, dozens of models exist for specialized purposes and work far better than ChatGPT for solving particular problems. For instance, we could implement a chatbot in a web application. What model should we use? Why that model? How can it be customized for the best user experience? These are the questions that developers will be asked in the future.

Creativity, Problem-solving, and Ethics

As AI becomes more embedded in software development and our everyday lives, the emphasis on ethical considerations and responsible use of AI will be magnified, and unique human skills such as creativity, empathy, and ethics will become more critical. AI can automate tasks, enhance workflow efficiencies, and augment the capabilities of software developers through tools like GitHub Copilot for code suggestions or automated testing and debugging tools. However, the essence of product design and development—understanding user needs and ethical implications, as well as ensuring accessibility—remain deeply human tasks that AI cannot replicate.

This evolving landscape necessitates a collaborative approach, requiring software engineers to work closely with data scientists, ethicists, and other stakeholders to ensure AI is used responsibly and beneficially.

Navigating the Future of Software Engineering with AI

Integrating AI into software engineering is a shift towards a more dynamic, efficient, and innovative approach to technology development. However, the human element is still as relevant today as it was 20 years ago. We may not know what the future holds, but we do know a few things:

  1. AI is reshaping all industries, not just tech. This means that technical skills will become increasingly important regardless of profession because you’ll need to work with these technologies whether you are a developer or not. Even if you move into another industry—retail, aerospace, medical, finance, etc.—all these industries will soon require some understanding of AI and the skills to work with it. 
  2. Coding is becoming table stakes for everyone. Many middle and high schools in the US already teach some basic coding to prepare learners for a future where all industries are more dependent on a tech-savvy workforce. Prompt engineering, software development, and communication skills will become more valuable over time, so getting a head-start by learning to code is always a solid career choice.
  3. The world needs intelligent, creative, and informed professionals to create the next generation of technologies. As AI technology becomes more accessible, one’s ability to use AI as a platform for innovation and advancement in all sectors will be the differentiating skill set. The reality is that companies are currently deciding how to optimize their workforces by augmenting current products with AI, but that won’t last long. 

Next-Gen AI Tools

The next generation of AI-powered tools and processes will enable the rapid development of new products and experiences. Efficiency gains may help companies in the short term by reducing costs. But, that effect will diminish significantly as product development cycles speed up. To stay competitive, companies must innovate and build products faster and at a higher quality. More products, more experiences, more competition. In the long run, AI will almost certainly create more technical jobs than it will displace. Still, future jobs will require workers to display high efficiency, communication skills, intelligence, and training in multiple technical domains.

Future Roles in Software Engineering with AI Integration

As AI becomes more intertwined with software engineering, new roles may emerge that will displace some traditional programming roles. New roles like Prompt Engineer, AI Quality Assurance Manager, and AI Ethics Officer are emerging and growing in response to the rapid adoption of AI into workflows and product solutions. These roles will also likely adapt with time, so we can’t expect to know the exact titles 5-10 years from now.

However, considering Generative AI’s known capabilities and limitations, we can speculate how it will impact software engineering roles.

  • Full-Stack Developer: Developers manage front-end and back-end systems. They write business logic, implement user experiences, and incorporate AI features to enhance user experiences and backend efficiencies. These developers will use languages like Python and JavaScript to develop full-stack products incorporating adaptive content and intelligent data systems. Understanding AI will enable these developers to create more responsive and smart applications.
  • Front-end Developer: Front-end developers create the interfaces we interact with every day. They create every page you see on the web with Javascript, HTML, and CSS and build applications using popular frameworks like React, Vue, and Svelt. Front-end developers can leverage user data to create personalized experiences, utilizing AI algorithms to tailor content and interfaces to individual preferences.
  • Back-end Developer: These developers create the server applications that talk to other systems and serve content to front-end applications. They build APIs, interact with databases, and make secure web applications by implementing authentication and validation. These developers will increasingly rely on AI for data processing and analysis, optimizing server-side operations, and enabling more sophisticated data-driven functionalities.

The Future is Bright

As AI continues to evolve, so will the roles and skills required in the field. Learning software development will give you many essential skills for the future. You’ll learn to code, work through complex problems, collaborate and communicate with stakeholders, work with AI tools, and start a lifelong growth journey.

Now is the time to embrace a life of continuous learning and ethical considerations that will be essential for those looking to lead the way in this new era. It’s never too late to start coding. We’ll see you at the keyboards!

The Building Blocks of Code: Understanding Programming Variables, Data Types, and Operators

Most software engineers end up using multiple programming languages throughout their careers. The great thing about programming languages is that certain core principles or concepts translate easily across languages. Once you learn and understand the building blocks of code, you’ll be able to pick up any technology on your own. Programming variables, data types, and operators are three of the most common building blocks across programming languages. In this post, we will be briefly exploring each of these fundamental concepts. 

I’ll be using Python examples since concrete examples are more illustrative. But the concepts will easily translate to other languages.

Understanding Data Types in Programming

A computer does not understand information like humans do. For example, when we look at a text or string like “Hi! My name is Al!” or a number like “10” we can distinguish between them easily. We understand that strings and numbers have different properties and are used in various contexts.

The computer cannot distinguish between different types of information automatically. There are unique ways to represent values so that the computer can differentiate them. Each unique type of value is assigned a “data type” to classify or organize them, allowing us to know what contexts a certain value can be used.

We will look at the most common data types used in Python:

  • str: Represents text or string values
  • int: Represents integer number values (whole numbers like 1, 5)
  • float: Represents floating-point numbers (decimal numbers like 1.556, 3.14)
  • bool: Represents the idea of correctness, (i.e., whether something is true or false)

String Values

We use the values of the str data type to represent textual information to the computer. Quotation marks are usually used to denote text as “string” in programming languages.

Here are some examples in Python:

Code for displaying various string values in the console using Python

Here’s the output of the above code:

Output of the code for displaying various string values in the console using Python

Notice a few important things:

  • The text is displayed exactly as it is written (i.e., the string values are case-sensitive)
  • Numbers wrapped in quotation marks are treated as strings
  • Single and double quotations can be used together. The opening and closing quotation marks must be the same. For example, we can’t start a string with a double quotation mark (“) and close it with a single quotation mark (‘).


We can represent numbers by writing them without the quotations.

Code for displaying various numbers in the console in Python

A few notes on the code:

  • Numbers written without quotations are interpreted as numerical values
  • A whole number (both positive and negative) is categorized as an “integer”
  • A decimal number (both positive and negative) is categorized as “float”

Bool or Boolean 

Human languages have the concept of correctness. For example, the sentence “elephants can fly” is incorrect or false. Similarly, computers also understand this concept. Programming languages provide a boolean data type (bool in Python) to express this concept.

In Python, the following values represent this concept:

  • True: indicates correctness in Python
  • False: indicates incorrectness in Python

Basic Operators in Programming

In mathematics, we can perform calculations using operators like +, -, / and so on. Programming languages also provide operators to perform calculations using values. Here’s an example of addition:

Code for displaying the plus operator usage in Python


Code output for the code displaying the plus operator usage in Python

Operators are usually used within expressions to get desired results.

What is an Expression?

An “expression” in Python is any code that evaluates to a value. A single value is also an expression. Here are a few examples:

  • 1 produces 1
  • “Hello!” produces “Hello!”
  • 5 * 2 produces 10
  • num > 100 produces either True or False

An expression can contain multiple expressions within it. Let’s take a look at a more complex expression:

An arithmetic expression example in Python

The above line of code has five expressions:

  • 5 (produces 5)
  • 2 (produces 2)
  • 3 (produces 3)
  • 5 + 2 (produces 7)
  • (5 + 2) + 3 (produces 10)

Here’s the expression used with the print function in Python:

Displaying output of the arithmetic expression example in Python

The computer evaluates the expression by simplifying it incrementally. Here are the intermediate steps that are hidden from us:

A breakdown of an expression into its final return value

Expressions in parentheses are evaluated first.

Variables in Coding

Variables are a way to make the computer remember values. A variable is a label to which a value can be assigned.

Variables allow programmers to give meaning to values and use those values throughout the program easily. For example, the number 238,900 doesn’t mean anything but if we label it as “the distance to the Moon from the Earth” it’s easier to reference. We don’t necessarily have to remember the exact value as we can look it up using the phrase “distance to the moon from the Earth.”

Here’s how we would use a variable in Python:

Code for assigning and displaying a variable in Python

We can use _ (underscore) to make big numbers easier to read in Python. Notice that we’re also using the _ to separate words in the variable name.


Code output for the code assigning and displaying a variable in Python

Variable Declaration and Assignment Walkthrough

Let’s look at how to create a variable again:

Code for declaring a variable in Python

There are three parts to this line:

  • cat_name is the variable name
  • = is an assignment operator
  • ‘Fifi’ is an expression that produces the value Fifi of type str.

So this is the general structure:

Shows the general variable declaration and assignment structure
  • The right side of the = operator is evaluated first
  • The value produced by the expression evaluation is then assigned to the variable name or label

The line cat_name = ‘Fifi’ is usually verbalized as “declare a variable called cat_name and assign the value ‘Fifi’ to it”

Learn About Programming Variables and More at Flatiron

If you’d like to learn more about foundational concepts such as fundamental data types, programming variables, operators, and functions, check out Flatiron School’s Software Engineering Bootcamp. You’ll find info on upcoming course start dates, career paths in the field, student success stories, and an FAQ.