<div class="edu-card" data-widget-id="10" data-cy="edu-card"> <div class="edu-card-banner" data-cy="edu-card-banner"> Advertisement </div> <div class="edu-card-container" data-cy="edu-card-container"> <div class="edu-card-content" data-cy="edu-card-content"> <div class="edu-card-title" data-cy="edu-card-title"> <h1 class="edu-card-title-heading" data-cy="edu-card-title-heading"> Berkeley's Data Science Master's </h1> <p class="edu-card-title-subheading" data-cy="edu-card-title-subheading"> Master Key Skills in Data Mining, Machine Learning, Research Design & More </p> </div> <div class="edu-card-content-description" data-cy="edu-card-content-description"> <div class="edu-card-content-description-content"> <p>The online Master of Information and Data Science (MIDS) program is preparing the next generation of experts and leaders in the data science field and providing students with a UC Berkeley education without having to relocate. Students graduate with connections to UC Berkeley’s extensive alumni network in the Bay Area and across the world. All international applicants will be required to submit official Test of English as a Foreign Language (TOEFL) scores.</p> </div> <span class="edu-card-content-description-readmore"> <input type="checkbox" id="edu-card-content-description-readmore-input-10" class="edu-card-content-description-readmore-input" /> <label for="edu-card-content-description-readmore-input-10" class="edu-card-content-description-readmore-label"> <span class="edu-card-content-description-readmore-label-arrow"></span> </label> </span> </div> <a class="edu-card-content-button" target="_blank" href="https://ischoolonline.berkeley.edu/requestinfo/mids/">Learn More</a> <span class="edu-card-content-caption"> </span> </div> <div class="edu-card-action" data-cy="edu-card-action"> <picture class="edu-card-picture" data-cy="edu-card-picture"> <img src="https://fortune.com/img-assets/wp-content/uploads/2024/07/UCB-DATA_MKTGAD-13675_Program-Logo_750x500.png?w=250&amp;h=165" class=""> <span class="edu-card-picture-label"> </span> </picture> <div class="edu-card-action-cta" data-cy="edu-card-action-cta"> <a class="edu-card-action-button" target="_blank" href="https://ischoolonline.berkeley.edu/requestinfo/mids/">Learn More</a> <span class="edu-card-action-caption"> </span> </div> </div> <table class="edu-card-table"> <tbody> <tr> <td>GRE Required</td> <td>No</td> </tr> <tr> <td>Part Time</td> <td>Yes</td> </tr> </tbody> </table> </div></div><script> function checkWidgets() { document.querySelectorAll('.edu-card-content-description-content').forEach((content) => { const readMoreBtn = content.nextElementSibling; if (!readMoreBtn) { return; } if (content && content.clientHeight === content.scrollHeight) { readMoreBtn.style.display = 'none'; } else { delete readMoreBtn.style.removeProperty('display'); } }) } window.removeEventListener('resize', checkWidgets); window.addEventListener('resize', checkWidgets); checkWidgets();</script>

<div class="edu-card" data-widget-id="56" data-cy="edu-card"> <div class="edu-card-banner" data-cy="edu-card-banner"> Advertisement </div> <div class="edu-card-container" data-cy="edu-card-container"> <div class="edu-card-content" data-cy="edu-card-content"> <div class="edu-card-title" data-cy="edu-card-title"> <h1 class="edu-card-title-heading" data-cy="edu-card-title-heading"> Full-Stack Web Development Certificate </h1> <p class="edu-card-title-subheading" data-cy="edu-card-title-subheading"> Start your coding career today </p> </div> <div class="edu-card-content-description" data-cy="edu-card-content-description"> <div class="edu-card-content-description-content"> <p>Get comprehensive career training in web development and software engineering. Life is unpredictable, so we're flexible: attend in-person or online, full-time or part-time, with access to class recordings after each session.</p> </div> <span class="edu-card-content-description-readmore"> <input type="checkbox" id="edu-card-content-description-readmore-input-56" class="edu-card-content-description-readmore-input" /> <label for="edu-card-content-description-readmore-input-56" class="edu-card-content-description-readmore-label"> <span class="edu-card-content-description-readmore-label-arrow"></span> </label> </span> </div> <a class="edu-card-content-button" target="_blank" href="https://www.nobledesktop.com/certificates/full-stack-development/?utm_source=fortune&amp;utm_medium=referral&amp;utm_campaign=[dynamic]post-id[/dynamic]">Visit Website</a> <span class="edu-card-content-caption"> </span> </div> <div class="edu-card-action" data-cy="edu-card-action"> <picture class="edu-card-picture" data-cy="edu-card-picture"> <img src="https://fortune.com/img-assets/wp-content/uploads/2024/07/Noble_logo-n-only.png?w=250&amp;h=165" class=""> <span class="edu-card-picture-label"> </span> </picture> <div class="edu-card-action-cta" data-cy="edu-card-action-cta"> <a class="edu-card-action-button" target="_blank" href="https://www.nobledesktop.com/certificates/full-stack-development/?utm_source=fortune&amp;utm_medium=referral&amp;utm_campaign=[dynamic]post-id[/dynamic]">Visit Website</a> <span class="edu-card-action-caption"> </span> </div> </div> </div></div><script> function checkWidgets() { document.querySelectorAll('.edu-card-content-description-content').forEach((content) => { const readMoreBtn = content.nextElementSibling; if (!readMoreBtn) { return; } if (content && content.clientHeight === content.scrollHeight) { readMoreBtn.style.display = 'none'; } else { delete readMoreBtn.style.removeProperty('display'); } }) } window.removeEventListener('resize', checkWidgets); window.addEventListener('resize', checkWidgets); checkWidgets();</script>

<div class="edu-card" data-widget-id="17" data-cy="edu-card"> <div class="edu-card-banner" data-cy="edu-card-banner"> Advertisement </div> <div class="edu-card-container" data-cy="edu-card-container"> <div class="edu-card-content" data-cy="edu-card-content"> <div class="edu-card-title" data-cy="edu-card-title"> <h1 class="edu-card-title-heading" data-cy="edu-card-title-heading"> Syracuse University's Online M.S. in Computer Science </h1> <p class="edu-card-title-subheading" data-cy="edu-card-title-subheading"> Earn a Master of Science in Computer Science Online in as few as 15 Months </p> </div> <div class="edu-card-content-description" data-cy="edu-card-content-description"> <div class="edu-card-content-description-content"> <p>Syracuse University's College of Engineering and Computer Science offers an online M.S. in Computer Science focusing on subjects crucial to understanding emerging systems.</p> </div> <span class="edu-card-content-description-readmore"> <input type="checkbox" id="edu-card-content-description-readmore-input-17" class="edu-card-content-description-readmore-input" /> <label for="edu-card-content-description-readmore-input-17" class="edu-card-content-description-readmore-label"> <span class="edu-card-content-description-readmore-label-arrow"></span> </label> </span> </div> <a class="edu-card-content-button" target="_blank" href="https://onlinegrad.syracuse.edu/requestinfo/mscs/">Learn More</a> <span class="edu-card-content-caption"> </span> </div> <div class="edu-card-action" data-cy="edu-card-action"> <picture class="edu-card-picture" data-cy="edu-card-picture"> <img src="https://fortune.com/img-assets/wp-content/uploads/2024/07/SYR-UMT_Lockup_Eng-Comp-Sci_Full-Configuration_RGB_COLOR_900px.png?w=250&amp;h=165" class=""> <span class="edu-card-picture-label"> </span> </picture> <div class="edu-card-action-cta" data-cy="edu-card-action-cta"> <a class="edu-card-action-button" target="_blank" href="https://onlinegrad.syracuse.edu/requestinfo/mscs/">Learn More</a> <span class="edu-card-action-caption"> </span> </div> </div> </div></div><script> function checkWidgets() { document.querySelectorAll('.edu-card-content-description-content').forEach((content) => { const readMoreBtn = content.nextElementSibling; if (!readMoreBtn) { return; } if (content && content.clientHeight === content.scrollHeight) { readMoreBtn.style.display = 'none'; } else { delete readMoreBtn.style.removeProperty('display'); } }) } window.removeEventListener('resize', checkWidgets); window.addEventListener('resize', checkWidgets); checkWidgets();</script>

ad_Comp-sci

cat_Other

Low Intent

ptype_Explainer

Sam Becker

<p><a href="https://fortune.com/education/articles/web-development-bootcamps/">Web development</a> has, for many years, been a lucrative career path for millions of people. Though there’s been a recent downturn in the tech sector, with many companies collectively laying off thousands of workers, there’s still a need for developers—including those who can work as front-end developers.</p><div class="paywall-selector"></div><div class="paywall">



<p>For those unfamiliar with <a href="https://fortune.com/education/careers/web-developer-jobs/">web development</a> as a discipline, many developers can specialize as either back-end or front-end web developers, while others can practice “<a href="https://fortune.com/education/articles/full-stack-developer/">full-stack</a>” development, working from front to back. </p>



<p>As for what a “front-end web developer” actually does? They work on the part of websites that users actually see, says Dan Martino, the digital director and founder of <a href="https://914digital.com/">914Digital</a>, a New York-based digital media company.</p>



<p>“Front-end development includes using HTML and CSS, styling websites, and making it look pretty,” he says. Effectively, a front-end developer may receive a website design from a designer, and then make it come to life on the internet—whereas a back-end developer does all the “under the hood” stuff, such as connecting databases and the like, according to Martino.</p>



<h2 class="wp-block-heading"><strong>How much do front-end developers make?</strong> </h2>



<p>As for how much front-end developers earn, a lot of it has to do with where the specific developer lives and or works. But overall, the average salary for front-end developers in the United States is $102,142, according to data from <a href="https://www.ziprecruiter.com/">ZipRecruiter</a>. But it’s important to note that salary, on its own, doesn’t account for a developer’s full compensation.</p>



<p>“For most of these types of roles, people get fairly generous benefits packages, and some type of bonus pay,” says Julia Pollak, Chief economist at ZipRecruiter. So, front-end developers may see significant bonuses—which scale up depending on how senior the developer is—and some may also get stock grants. In all, Pollak says that “looking at job postings will not give you the full figure—adding equity and bonuses can add as much as 50%” of a developer’s salary to their total compensation.</p>



<p>As for where front-end developers are earning the most, ZipRecruiter’s internal data shared with Fortune Education shows that a surprising state—Montana—leads the list with average salaries topping $117,000. It’s followed by New Hampshire, California, Tennessee, and Wisconsin, where front-end developers are all earning more than $113,000 on average.</p>



<h2 class="wp-block-heading"><strong>Cost of living</strong></h2>



<p>For developers of all stripes, the cost of living in a given state is something that also must be considered—a relatively high salary can be moot if you’re living in an expensive area. Especially in an era of rising prices, as seen over the past couple of years, taking both earnings and expected expenditures into account can help developers get a sense of how far their salary will take them. </p>



<p>That said, Pollak notes that it’s possible that front-end developers can find high-paying jobs in traditionally low-cost states, often because some industries tend to cluster in certain cities. Examples include credit card companies in South Dakota, or health care companies in Kentucky—both are cheap, relative to states like New York or California, but the companies based there need developers. </p>



<p>As such, there may be opportunities in those states to increase earning and purchasing power.</p>



<figure class="wp-block-embed is-type-rich is-provider-datawrapper wp-block-embed-datawrapper"><div class="wp-block-embed__wrapper">
<iframe title="Comparing the relative cost of living in each state" aria-label="map" id="datawrapper-chart-BFUNn" src="https://datawrapper.dwcdn.net/BFUNn/3/" scrolling="no" frameborder="0" style="width: 0; min-width: 100% !important; border: none;" height="623" data-external="1"></iframe><script type="text/javascript">!function(){"use strict";window.addEventListener("message",(function(a){if(void 0!==a.data["datawrapper-height"]){var e=document.querySelectorAll("iframe");for(var t in a.data["datawrapper-height"])for(var r=0;r<e.length;r++)if(e[r].contentWindow===a.source){var i=a.data["datawrapper-height"][t]+"px";e[r].style.height=i}}}))}();</script>
</div></figure>



<h2 class="wp-block-heading"><strong>Front-end developer salary by state</strong> </h2>



<p>You can find the states with the highest average salaries for front-end developers below. Salary numbers are from ZipRecruiter, and are the averages for each state as calculated between the beginning of 2024 through early May 2024. Each state’s cost of living (COL) index is calculated by <a href="https://meric.mo.gov/data/cost-living-data-series">the Missouri Economic Research and Information Center (MERIC)</a>, which averages indexes from metro areas and cities, and incorporates costs for groceries, housing, utilities, and transportation.</p>



<p>Here are the states with the highest-earning front-end web developers:</p>



<figure class="wp-block-table optimized-table-widget"><table><thead><tr><th>Rank</th><th>Location</th><th><strong>Avg. salary (as of May 2024)</strong></th><th>Cost of living</th></tr></thead><tbody><tr><td>1</td><td>Montana</td><td>$117,200</td><td>102.9</td></tr><tr><td>2</td><td>New Hampshire</td><td>$114,650</td><td>114.1</td></tr><tr><td>3</td><td>California</td><td>$114,424</td><td>138.5</td></tr><tr><td>4</td><td>Tennessee</td><td>$113,950</td><td>90.3</td></tr><tr><td>5</td><td>Wisconsin</td><td>$113,785</td><td>95.1</td></tr><tr><td>6</td><td>North Dakota</td><td>$113,450</td><td>94.6</td></tr><tr><td>7</td><td>Washington</td><td>$112,100</td><td>116</td></tr><tr><td>8</td><td>Alaska</td><td>$110,200</td><td>125.2</td></tr><tr><td>9</td><td>New Mexico</td><td>$109,400</td><td>94</td></tr><tr><td>10</td><td>Connecticut</td><td>$108,529</td><td>112.8</td></tr><tr><td>11</td><td>Washington, D.C.</td><td>$108,447</td><td>146.8</td></tr><tr><td>12</td><td>South Carolina</td><td>$107,711</td><td>95.3</td></tr><tr><td>13</td><td>Ohio</td><td>$107,644</td><td>94.7</td></tr><tr><td>14</td><td>Massachusetts</td><td>$106,421</td><td>146.5</td></tr><tr><td>15</td><td>Pennsylvania</td><td>$106,098</td><td>95.6</td></tr><tr><td>16</td><td>Minnesota</td><td>$105,373</td><td>94.1</td></tr><tr><td>17</td><td>Idaho</td><td>$103,636</td><td>98.6</td></tr><tr><td>18</td><td>Missouri</td><td>$103,364</td><td>88.5</td></tr><tr><td>19</td><td>Delaware</td><td>$103,080</td><td>101.1</td></tr><tr><td>20</td><td>New Jersey</td><td>$101,378</td><td>113.9</td></tr><tr><td>21</td><td>Kentucky</td><td>$101,369</td><td>92</td></tr><tr><td>22</td><td>North Carolina</td><td>$101,301</td><td>95.3</td></tr><tr><td>23</td><td>Vermont</td><td>$101,125</td><td>115.3</td></tr><tr><td>24</td><td>Kansas</td><td>$100,545</td><td>87.1</td></tr><tr><td>25</td><td>Alabama</td><td>$100,527</td><td>88.3</td></tr><tr><td>26</td><td>Oklahoma</td><td>$100,525</td><td>86.2</td></tr><tr><td>27</td><td>Wyoming</td><td>$100,250</td><td>92.4</td></tr><tr><td>28</td><td>South Dakota</td><td>$100,092</td><td>92.4</td></tr><tr><td>29</td><td>Colorado</td><td>$99,981</td><td>105.1</td></tr><tr><td>30</td><td>Michigan</td><td>$99,732</td><td>90.6</td></tr><tr><td>31</td><td>Maine</td><td>$99,357</td><td>109.9</td></tr><tr><td>32</td><td>Louisiana</td><td>$98,900</td><td>91</td></tr><tr><td>33</td><td>Nevada</td><td>$98,500</td><td>101</td></tr><tr><td>34</td><td>Rhode Island</td><td>$98,388</td><td>110.7</td></tr><tr><td>35</td><td>Nebraska</td><td>$97,854</td><td>90.9</td></tr><tr><td>36</td><td>West Virginia</td><td>$97,669</td><td>87.7</td></tr><tr><td>37</td><td>Virginia</td><td>$97,421</td><td>101.9</td></tr><tr><td>38</td><td>Iowa</td><td>$97,325</td><td>90.3</td></tr><tr><td>39</td><td>Utah</td><td>$96,413</td><td>103.2</td></tr><tr><td>40</td><td>Arizona</td><td>$96,072</td><td>108.4</td></tr><tr><td>41</td><td>Mississippi</td><td>$95,920</td><td>86.3</td></tr><tr><td>42</td><td>Arkansas</td><td>$95,428</td><td>89</td></tr><tr><td>43</td><td>Georgia</td><td>$95,108</td><td>90.8</td></tr><tr><td>44</td><td>Texas</td><td>$94,258</td><td>92.7</td></tr><tr><td>45</td><td>Illinois</td><td>$93,420</td><td>92.1</td></tr><tr><td>46</td><td>Maryland</td><td>$92,185</td><td>116.5</td></tr><tr><td>47</td><td>Oregon</td><td>$92,100</td><td>114.7</td></tr><tr><td>48</td><td>Indiana</td><td>$91,279</td><td>91</td></tr><tr><td>49</td><td>Florida</td><td>$91,082</td><td>100.7</td></tr><tr><td>50</td><td>Hawaii</td><td>No data</td><td>180.3</td></tr><tr><td>51</td><td>New York</td><td>No data</td><td>125.9</td></tr></tbody></table><figcaption class="wp-element-caption"><strong>Front-end developer salary by state</strong> </figcaption></figure>



<h2 class="wp-block-heading"><strong>The takeaway</strong> </h2>



<p>Front-end web development can be a lucrative career path, with average earnings ranging from between $91,000 to upward of $117,000, depending on where a developer lives and works. Though there have been recent rounds of layoffs in the tech sector, web development, overall, is expected to see overall growth in terms of job numbers—<a href="https://www.bls.gov/ooh/computer-and-information-technology/web-developers.htm">growing 16% by 2032</a>, according to data from the Bureau of Labor Statistics.</p>



<p><strong>Learn more</strong>: <a href="https://fortune.com/education/careers/back-end-developer-salary/">Back-end developer salaries</a></p>



<p>As the data shows, front-end developers can earn fairly high salaries in every state, with the states where front-end developers earn the most being somewhat surprising, such as Montana and New Hampshire. But it’s also important to keep the total compensation package in mind when looking at earnings—stock grants and bonuses can provide a serious, and somewhat hidden, boost to earnings.</p>



<p>Fortune ranks other bootcamps where you can expand your knowledge in areas such as <a href="https://fortune.com/education/articles/ai-bootcamps/">AI</a> and <a href="https://fortune.com/education/articles/best-software-engineering-bootcamps/">software engineering</a>.</p>
</div>

Front-end developers work on the visual aspect of websites, and can earn relatively high annual salaries. The states where they’re paid the most, though, may surprise you.

Front-end developers: These are the states where you’ll find the highest average salaries

Woman coder sitting at desk with 2 monitors while pointing a pen at the screen

F-Search

Explainer

Career Hub

Jasmine Suarez

Education Articles

Tech

Fortune earns a commission for purchases made from affiliate partners via some links on our site; other links are not affiliate partner links. <a href='/affiliate-disclosure/'>Click here</a> to read the full Fortune advertiser disclosure and how we earn commissions.

We have independently evaluated the products and services below. We may earn affiliate revenue from links in the content.

Fortune Editors

Fortune Education is designed to be your guide to navigating this new, rich and somewhat overwhelming world of education. Our team of experienced editors is committed to scouring the universe of online offerings in order to rank, rate, provide comparisons and recommend the right solutions for you and your career.

Fortune Education

Uncategorized

homepage

articles

Articles Hub

By Region

By State

By Cost

Business

Health and Wellness

EDUCATION

CAREER HUB

FRONT-END DEVELOPERS: THESE ARE THE STATES WHERE YOU’LL FIND THE HIGHEST AVERAGE SALARIES

Front-end developers: These are the states where you’ll find the highest average salaries | Fortune Education

Preston Fore

These are the nation's fastest growing jobs—and many pay $100k

https://fortune.com/education/careers/bls-occupation-projections/?itm_source=parsely-api

How to become a financial advisor: 4 steps to a life-long career

https://fortune.com/education/careers/how-to-become-a-financial-advisor/?itm_source=parsely-api

Data engineers are in high demand—and companies are willing to pay over $125k for skilled workers

https://fortune.com/education/careers/data-engineer-salary/?itm_source=parsely-api

Brit Morse

A law associate making $300,000 a year at Skadden Arps quit over the firm’s deal with Donald Trump

/article/rachel-cohen-making-300k-year-law-associate-skadden-arps-quit-protest-firms-deal-trump/

Get ready to pay more than $2,000 for a new iPhone: Experts say Trump’s 125% tariff on China is a ‘complete disaster for Apple’ akin to ‘Armageddon’

/2025/04/10/apple-iphone-16-price-complete-disaster-china-trump-tariffs/

It’s about to get a lot harder for job seekers as tariffs are set to make the hiring landscape even more daunting

/2025/04/07/trump-tariffs-labor-market-more-challenging-job-seekers-economists-say/

This company does peer performance reviews—And then lets everyone read each other’s evaluations

/2025/03/24/performance-review-process-company-allows-all-workers-read-garner-health-workplace-culture/

2024 health coach certification review: Catalyst Coaching Institute

/education/articles/health-coach-certification-review-catalyst-coaching-institute/

A guide to a nurse’s salary: Broken down by all 50 states and industry type

/education/careers/nurse-salary/

2024 health coach certification review: Institute for Integrative Nutrition

/education/articles/health-coach-certification-review-institute-for-integrative-nutrition/

Rich Griset

10 high-paying public health jobs right now

/education/careers/public-health-jobs/

Jason Del Rey

Is eBay actually sexy again as the ecommerce old-timer’s stock surges to an all-time high?

/2025/07/31/ebay-earnings-live-sports-cards-trading-pokemon/

Erik German

Meet the CIA-backed venture fund behind Palantir, Anduril—and a spy tool that might be on your phone

/2025/07/29/in-q-tel-cia-venture-capital-palantir-anduril/

Dana Hull

Kiel Porter

Bloomberg

Tesla engineering VP Moravy says company in ‘big swing moment’

/2025/07/27/tesla-engineering-vp-lars-moravy-big-swing-moment-musk-robotaxi-optimus-semi/

Christiaan Hetzner

Volkswagen seeks audience with Trump, dangling more than $10 billion in U.S. investments in exchange for tariff exemptions

/2025/07/25/volkswagen-trump-tariffs-exemptions/

Whether you’ve just completed your undergraduate degree or you are a professional with years of experience, Fortune is here to guide you on the next step of your educational journey.

Education

Front-end developers: These are the states where you’ll find the highest average salaries

About the Contributors

Top Articles

These are the nation's fastest growing jobs—and many pay $100k

How to become a financial advisor: 4 steps to a life-long career

Data engineers are in high demand—and companies are willing to pay over $125k for skilled workers

Syracuse University's Online M.S. in Computer Science