index.html

<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Home - CS 357</title>
    <link rel="icon" href="/assets/img/favicon.png">
    <link rel="shortcut icon" href="/assets/img/favicon.png" />
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
    <!-- animate CSS -->
    <link rel="stylesheet" href="/assets/css/animate.css">
    <!-- owl carousel CSS -->
    <link rel="stylesheet" href="/assets/css/owl.carousel.min.css">
    <!-- themify CSS -->
    <link rel="stylesheet" href="/assets/css/themify-icons.css">
    <!-- flaticon CSS -->
    <link rel="stylesheet" href="/assets/css/flaticon.css">
    <!-- font awesome CSS -->
    <link rel="stylesheet" href="/assets/css/magnific-popup.css">
    <!-- swiper CSS -->
    <link rel="stylesheet" href="/assets/css/slick.css">
    <!-- style CSS -->
    <link rel="stylesheet" href="/assets/css/style.css">
    <!-- opengraph -->
    <meta property="og:site_name" content="CS 357 Spring 2025" />
    <meta property="og:title" content="Home - CS 357" />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="/assets/img/photos/group-CIF.png" />
    <!-- Mathjax Support -->
    <script type="text/javascript" async
            src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/3.0.0/es5/latest?tex-mml-chtml.js">
    </script>

    
    <script>
        (function (i, s, o, g, r, a, m) {
            i['GoogleAnalyticsObject'] = r;
            i[r] = i[r] || function () {
                (i[r].q = i[r].q || []).push(arguments)
            }, i[r].l = 1 * new Date();
            a = s.createElement(o),
                m = s.getElementsByTagName(o)[0];
            a.async = 1;
            a.src = g;
            m.parentNode.insertBefore(a, m)
        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

        ga('create', 'UA-157880752-1', 'auto');
        ga('send', 'pageview');
    </script>
    
</head>

<nav class="main_menu home_menu">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-12">
                <nav class="navbar navbar-expand-lg navbar-light">
                    <a class="navbar-brand" href="/">
                        
                            <img class="mr-2" style="max-height:25pt" src="/assets/img/logo.png" alt="logo"> CS 357 <span class="badge badge-success">Spring 2025</span>
                        
                    </a>
                    <button class="navbar-toggler" type="button" data-toggle="collapse"
                            data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                            aria-expanded="false" aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>

                    <div class="collapse navbar-collapse main-menu-item justify-content-end"
                         id="navbarSupportedContent">
                        <ul class="navbar-nav align-items-center">
                            <li class="nav-item ignore-md-custom-style">
                                <a class="nav-link" href="/pages/syllabus.html">Syllabus</a>
                            </li>
                            <li class="nav-item ignore-md-custom-style">
                                <a class="nav-link" href="/pages/schedule.html">Schedule</a>
                            </li>
                            <li class="nav-item ignore-md-custom-style">
                                <a class="nav-link" href="/pages/contact.html">Support</a>
                            </li>
                            <li class="nav-item ignore-md-custom-style">
                                <a class="nav-link" href="/pages/lectures.html">Group Activities</a>
                            </li>
                            <li class="nav-item ignore-md-custom-style">
                                <a class="nav-link" href="/pages/quizzes.html">Quizzes</a>
                            </li>
                             <!--Mobile view has different textbook button. -->
                            <li class="d-lg-none nav-item ignore-md-custom-style">
                                <a class="nav-link" href="https://cs357.cs.illinois.edu/textbook">Online Textbook</a>
                            </li>
                            <li class="d-none d-lg-block ignore-md-custom-style">
                                <a class="btn_1" href="https://cs357.cs.illinois.edu/textbook">Online Textbook</a>
                            </li>
                        </ul>
                    </div>
                </nav>
            </div>
        </div>
        
    </div>
</nav>

<body>
<section class="contact_info section_padding">
    <div class="container mb-4">
        <h1 class="page-title">Numerical Methods I</h1>
    </div>
<div class="container mb-4">

    <a href="/pages/syllabus.html" class="btn_1">Syllabus</a>
    <a href="https://us.prairielearn.com/pl/course_instance/171058" class="btn_2" style="margin: 0px !important;">PrairieLearn</a>
    <a class="btn_3" href="https://discord.gg/qZqYUKbnVU"
        style="background-color: #5865F2 !important; background-image: none !important; color: white; font-weight: normal !important; margin: 0px !important;">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-discord"
            viewBox="0 0 16 16" style="margin-right: 4px;">
            <path
                d="M13.545 2.907a13.2 13.2 0 0 0-3.257-1.011.05.05 0 0 0-.052.025c-.141.25-.297.577-.406.833a12.2 12.2 0 0 0-3.658 0 8 8 0 0 0-.412-.833.05.05 0 0 0-.052-.025c-1.125.194-2.22.534-3.257 1.011a.04.04 0 0 0-.021.018C.356 6.024-.213 9.047.066 12.032q.003.022.021.037a13.3 13.3 0 0 0 3.995 2.02.05.05 0 0 0 .056-.019q.463-.63.818-1.329a.05.05 0 0 0-.01-.059l-.018-.011a9 9 0 0 1-1.248-.595.05.05 0 0 1-.02-.066l.015-.019q.127-.095.248-.195a.05.05 0 0 1 .051-.007c2.619 1.196 5.454 1.196 8.041 0a.05.05 0 0 1 .053.007q.121.1.248.195a.05.05 0 0 1-.004.085 8 8 0 0 1-1.249.594.05.05 0 0 0-.03.03.05.05 0 0 0 .003.041c.24.465.515.909.817 1.329a.05.05 0 0 0 .056.019 13.2 13.2 0 0 0 4.001-2.02.05.05 0 0 0 .021-.037c.334-3.451-.559-6.449-2.366-9.106a.03.03 0 0 0-.02-.019m-8.198 7.307c-.789 0-1.438-.724-1.438-1.612s.637-1.613 1.438-1.613c.807 0 1.45.73 1.438 1.613 0 .888-.637 1.612-1.438 1.612m5.316 0c-.788 0-1.438-.724-1.438-1.612s.637-1.613 1.438-1.613c.807 0 1.451.73 1.438 1.613 0 .888-.631 1.612-1.438 1.612" />
        </svg>
        Discord
    </a>

</div>
    <div class="container mb-4">
        <h3>Course Description</h3>

        <p>
            Fundamentals of numerical methods for students in science and engineering;
            floating-point computation, systems of linear equations, approximation of
            functions and integrals, the single nonlinear equation, and the
            numerical solution of ordinary differential equations; various
            applications in science and engineering; programming exercises
            and use of high quality mathematical library routines. Course
            Information: Same as MATH 357. Credit is not given for CS 357
            if credit for CS 450 has been earned. (Counts for advanced hours in LAS).
            Prerequisite: A 100-level computer science course; MATH 257; MATH 241.
        </p>
    </div>
    <div class="container mb-4">
        <h3>Learning objectives</h3>
        <p> Students should be able to:</p>
        <ol>
            <li>Analyze the sources of errors in mathematical operations on the computer</li>
            <li>Recognize major numerical methods and their merits and pitfalls</li>
            <li>Calculate the computational cost of a range of numerical methods</li>
            <li>Select and use software tools, based on their numerical methods, for a range of problems</li>
            <li>Estimate the accuracy in approximated numerical solutions</li>
            <li>Work in small groups on open ended problems</li>
        </ol>
    </div>
    <div class="container mb-4">
        <h3>Course format</h3>

        <p>
            <strong>Flipped classroom:</strong> Students complete weekly pre-lecture assignments and corresponding
            homework sets asynchronously. The course is offered in two modalities (sections): in-person and online.
            The only difference between the sections is how students complete the “in-class” activities. In the
            in-person section, students attend class during lecture time and work in teams on computer-based activities.
            In the online section, students complete the same activities asynchronously (but on the same day as the
            in-person students), still in groups, with no attendance requirement. Students are allowed to switch
            sections during the first two weeks of the semester to choose the format that best suits their learning
            style or personal preferences.
            The “in-class” assignments consist of Group Activities (GAs) delivered through PrairieLearn. Students work
            in teams of 2-3 to complete the GAs. For more details, see the <a
                href="/pages/lectures.html">Group Activities</a> page.
        </p>
        <p>
            <strong>Bi-weekly quizzes:</strong> Students complete six 50-minutes quizzes at the <a
                href="https://cbtf.illinois.edu/students">Computer-Based Testing Facility</a>. There is no option for
            online quizzes. For more details, see the <a href="/pages/quizzes.html">Quizzes</a> page.
        </p>
        <p>
            <strong>Course support:</strong> We offer support both online via <a
                href="https://discord.gg/qZqYUKbnVU">Discord</a> and in-person at the Siebel Basement. Check the schedule for
            office hours and find instructions on how to use Discord on our <a
                href="/pages/contact.html">Support</a> page.
        </p>

    </div>
</section>


<!-- staff gallery start -->
<style>
    .custom-gallery-container {
        width: 80%;
        margin: 0 auto;
    }

    .custom-gallery-padding {
        padding: 140px 0px 80px 0px;
    }

    .custom-staff-image {
        width: 100%;
        height: 400px;
        object-fit: cover;
        /* important: no image distortion when fitting other screen size */
        border-radius: 0.25rem;
        transition: height 0.8s ease;
    }

    .custom-staff-bio {
        padding: 10px;
        background-color: #f8f8f8;
        border-top: 1px solid #9c9c9c;
        /* text-align: justify; */
        /* depends if you want text justify or not */
    }

    .custom-hover {
        background-color: #f8f8f8;
        transition: background-color 0.5s ease;
    }

    .custom-hover:hover {
        background-color: #fff;
        cursor: pointer;
    }
</style>
<!-- staff gallery start -->
<section>
    <div class="container-fluid">
        <div class="row justify-content-center">
            <div class="col-xl-5">
                <div class="section_tittle text-center">
                    <h2>Meet the Course Staff</h2>
                </div>
            </div>
        </div>

        <div class="custom-gallery-container row justify-content-center">
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="mfsilva-img"
                        src="/assets/img/staff/mfsilva.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Mariana Silva</h5>
                        <p class="card-text">prof</p>
                    </div>
                    <div id="mfsilva-bio" class="custom-staff-bio">
                        <div class="card-links">
                            <a href="mailto:mfsilva@illinois.edu">Email,</a>
                            
                            <a href="http://mfsilva.web.illinois.edu/" target="_blank">Webpage</a>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="kaiyaok2-img"
                        src="/assets/img/staff/kaiyaok2.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Kaiyao Ke</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="kaiyaok2-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="ananthm3-img"
                        src="/assets/img/staff/ananthm3.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Ananth Madan</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="ananthm3-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="skagini2-img"
                        src="/assets/img/staff/skagini2.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Shuban Kagini</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="skagini2-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="aryanm8-img"
                        src="/assets/img/staff/aryanm8.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Aryan Malhotra</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="aryanm8-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="jizej2-img"
                        src="/assets/img/staff/jizej2.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Jize Jiang</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="jizej2-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="zihaoli5-img"
                        src="/assets/img/staff/zihaoli5.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Zihao Li</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="zihaoli5-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                            <a href="https://www.zihao.website/" target="_blank">Webpage</a>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="cx23-img"
                        src="/assets/img/staff/cx23.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Calvin Xu</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="cx23-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="zhan32-img"
                        src="/assets/img/staff/zhan32.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Jianyuan Zhan</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="zhan32-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="hongboz2-img"
                        src="/assets/img/staff/hongboz2.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Hongbo Zheng</h5>
                        <p class="card-text">grad</p>
                    </div>
                    <div id="hongboz2-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="dsingh14-img"
                        src="/assets/img/staff/dsingh14.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Dev Singh</h5>
                        <p class="card-text">ugrad</p>
                    </div>
                    <div id="dsingh14-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                            <a href="https://devksingh.com" target="_blank">Webpage</a>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="kpate457-img"
                        src="/assets/img/staff/kpate457.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Kajal Patel</h5>
                        <p class="card-text">ugrad</p>
                    </div>
                    <div id="kpate457-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="julie11-img"
                        src="/assets/img/staff/julie11.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Julie Lima</h5>
                        <p class="card-text">ugrad</p>
                    </div>
                    <div id="julie11-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="hongyid3-img"
                        src="/assets/img/staff/hongyid3.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Sam Dong</h5>
                        <p class="card-text">ugrad</p>
                    </div>
                    <div id="hongyid3-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
                <div class="card max-height custom-hover">
                    <img id="emilyh10-img"
                        src="/assets/img/staff/emilyh10.jpg"
                        class="custom-staff-image card-img-top"
                        onerror="this.src='/assets/img/staff/blank_profile.png'">
                    <div class="card-body">
                        <h5 class="card-title">Emily Hsieh</h5>
                        <p class="card-text">ugrad</p>
                    </div>
                    <div id="emilyh10-bio" class="custom-staff-bio">
                        <div class="card-links">
                            
                            
                        </div>
                    </div>
                </div>
            </div>
            
        </div>
    </div>
</section>
<!-- staff gallery end -->
</body>
<script src="/assets/js/jquery-1.12.1.min.js"></script>
<!-- popper js -->
<script src="/assets/js/popper.min.js"></script>
<!-- bootstrap js -->
<script src="/assets/js/bootstrap.min.js"></script>
<!-- easing js -->
<script src="/assets/js/jquery.magnific-popup.js"></script>
<!-- swiper js -->
<script src="/assets/js/swiper.min.js"></script>
<!-- swiper js -->
<script src="/assets/js/masonry.pkgd.js"></script>
<!-- particles js -->
<script src="/assets/js/owl.carousel.min.js"></script>
<script src="/assets/js/jquery.nice-select.min.js"></script>
<!-- swiper js -->
<script src="/assets/js/slick.min.js"></script>
<script src="/assets/js/jquery.counterup.min.js"></script>
<script src="/assets/js/waypoints.min.js"></script>
<!-- custom js -->
<script src="/assets/js/custom.js"></script>

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
</html>