Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Build a Mobile Web App Using jQuery Mobile & AJAX: Part 1

Posted by George Akinian
George Akinian
17,615 Points

Why can't I use MAMP instead of Anvil?

  1. I am trying to server the file with MAMP but it doesn't load in Chrome. App works fine in Firefox.

It logs this error

- Uncaught SecurityError: Failed to execute 'replaceState' on 'History': A history state object with URL 'file:///Users/georgeakinian/Projects/goodweather/index.html' cannot be created in a document with origin 'null'.

  1. What is the adventages of using Anvil over Apache with MAMP? 
<!doctype html>
<html>

<head>
    <title>GOOD Weather</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- <link rel="apple-touch-icon" href="images/icon.png"/>  
    <meta name="apple-mobile-web-app-capable" content="yes" />   -->


    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/stylesheet.css">


</head>

<body>

<div data-role="page">
    <div data-role="panel" id="left-panel" data-theme="c">
        <ul data-theme="d" data-role="listview">
            <li data-icon="delete"><a href="#" data-rel="close">Close</a></li>  
            <li data-role="list-divider">Select a City</li>
                <li ><a href="#" class="city" data-rel="close">Current Location</a></li>
                <li ><a href="#" class="city" data-rel="close">Chicago</a></li>
                <li ><a href="#" class="city" data-rel="close">Los Angeles</a></li>
                <li ><a href="#" class="city" data-rel="close">Miami</a></li>
                <li ><a href="#" class="city" data-rel="close">New York</a></li>
                <li ><a href="#" class="city" data-rel="close">San Francisco</a></li>
        </ul>
    </div><!-- /panel -->

    <div data-role="header" data-position="fixed" data-theme="c">
        <h1>GOOD Weather</h1>
        <a href="#left-panel" data-icon="bars" data-role="button"  data-iconpos="notext" data-iconshadow="false">Menu</a>
    </div>
    <div data-role="content" class="content">
        <h1 id="current_temp" class="icon" data-icon="B">65&#176;F</h1>
        <p id="current_summary">Partly Cloudy</p>
        <p id="location">Current Location</p> 
    </div>
</div>


</body>

</html>