Skip to content

Commit

Permalink
Update sample projects
Browse files Browse the repository at this point in the history
  • Loading branch information
@kaylagordon
kaylagordon committed May 20, 2024
1 parent e1232fe commit 4d566e2
Showing 1 changed file with 22 additions and 108 deletions.
130 changes: 22 additions & 108 deletions what-students-learn/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,142 +17,56 @@ <h1>What Students Learn and Build at Turing</h1>
<br>
<section class="fe-project-section project-section">
<div class="project-controls">
<h2>Front End Progression</h2>
<button id="show-be-projects-btn" class="s-button s-button-secondary-inverse">Show Back End Progression</button>
<h2>Program Progression</h2>
<!-- <button id="show-be-projects-btn" class="s-button s-button-secondary-inverse">Show Back End Progression</button> -->
</div>
<div>
<p>Front End Engineering focuses on building the part of applications that users see and interact with. Our curriculum covers object-oriented programming, modern frameworks, cross-browser compatibility, and touches
on basic UX and design principles. The program is approximately 7 months long, broken up into four 6-week modules.</p>

<section class="module-card fe-project-card">
<h3>Module 1</h3>
<p>Module 1 focuses on building a foundation for Front End Engineering and some of the tools and processes necessary for
development. The bulk of students' time will be spent learning and implementing JavaScript fundamentals, including object-oriented programming. Students will also recreate design comps with HTML and CSS.</p>
<div class="project">
<p><strong>Student Project:</strong> By the end of the module, students are able to build an application like this Tic-Tac-Toe game that can be played by a user in a web browser. A seemingly simple game, a good amount of logic and software design are both required.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/QE17zFLT8K4" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>

<section class="module-card fe-project-card">
<h3>Module 2</h3>
<p>Module 2 focuses on JavaScript, popular patterns for writing and organizing front end code, and
learning new tools and workflows to help improve the development process for more complex web applications.</p>
<div class="project">
<p><strong>Student Project:</strong> By the end of the module, students are able to build an application like this hotel management tool for hotel customers and staff to manage room bookings and calculate customer
bills. In building this project, students apply concepts around designing and organizing code, and making network
requests to send and receive data.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/szR8lKarBpI" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>

<section class="module-card fe-project-card">
<h3>Module 3</h3>
<p>Module 3 focuses on front end frameworks and libraries for building complex, scalable, fully-tested applications, as
learning new tools and workflows to help improve the development process for more complex web applications.</p>
<div class="project">
<p><strong>Student Project:</strong> In Module 3, students are able to choose the topic and content of the project as long as they implement certain technologies. This sample project uses React and Redux, a network request to the Wordnik API, and was fully tested. While the features in this project may appear to be less robust than the Module 2 project, it uses more sophisticated technologies. This project was built by one student in about 5 days.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/h2kL1GpOW6c" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>

<section class="module-card fe-project-card">
<h3>Module 4</h3>
<p>In Module 4, students work in full-stack (Front End <em>and</em> Back End) engineering teams to emulate a professional
working environment. Students are expected to apply all of the technical and professional development concepts they
have learned throughout
the program in order to extend and refactor existing production quality code as well as create new web and mobile
applications from start to finish. In addition, students refine their behavioral and technical interviewing skills
through weekly group and solo practice, networking and outreach with industry professionals, and self-reflection.</p>
<!-- <div class="project">
<p><strong>Student Project:</strong> This application was built by 2 Back End students and 2 Front End students during their last 2 weeks before graduation. They collaborated using a professional workflow to bring together their passions for brainstorming, interesting design trends and challenging logic.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/ST-pvNtr74s" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="project">
<p><strong>Student Project:</strong> This application was built by 1 Back End student and 3 Front End students in about 2 weeks. One Front End student had the role of Back End Developer on this project! This group faced interesting and relevant challenges such as storing images in a database and using technologies they were not yet familiar with.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/pMYlM7yifm8" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div> -->
<div class="project">
<p><strong>Student Project:</strong> This application was built by 2 Back End students and 2 Front End students in about
2 weeks. They saw an opportunity in their community and built something to create change using their new skills!</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/8xn9zWLJPms" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>

</div>
</section>

<section class="be-project-section project-section">
<div class="project-controls">
<h2>Back End Progression</h2>
<button id="show-fe-projects-btn" class="s-button s-button-secondary-inverse">Show Front End Progression</button>
</div>
<div>
<p>Back End Engineering focuses on most of the work that happens behind-the-scenes to make an application function. Our curriculum
covers object-oriented programming, data structures, and building database-backed web applications. The program is approximately 7 months long, broken up into four 6-week modules.</p>

<section class="module-card be-project-card">
<h3>Module 1</h3>
<p>Module 1 focuses on using the Ruby language and object-oriented programming (OOP) to build software. Students develop skills
to write automated tests, pseudocode, write implementation code and refactor code to meet Ruby conventions.</p>
<p>Module 1 focuses on using the coding fundamentals and object-oriented programming (OOP) to build software. Students develop skills to write automated tests, pseudocode, write implementation code and refactor code to meet Ruby conventions.</p>
<div class="project">
<p><strong>Student Project:</strong> By the end of Module 1, Back End students are able to build a program like this command line Battleship game. Behind the
interface is a lot of work with logic, decisions about how to structure data and error checking. Projects of this nature
build a strong foundation with object-oriented programming (OOP) and software design principles.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/uOY7z_r3JF0" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/uOY7z_r3JF0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>
<section class="module-card be-project-card">

<section class="module-card fe-project-card">
<h3>Module 2</h3>
<p>Module 2 is when Back End students expand upon fundamental Ruby skills by building database-backed web applications in Rails. They also explore best practices in agile project management and collaboration.</p>
<p>Module 2 focuses on Web Application Development. Using Rails, we’ll work through the key concepts and build functional full-stack applications. Along the way, we lean into Javascript both as a comparison to the work we're doing on the back end as well as starting to implement some things client side. By the end of the module, students are building and deploying respectable full-stack applications.</p>
<div class="project">
<p><strong>Student Project:</strong> This project is a fictitious pet adoption platform where visitors can favorite pets and apply to adopt their
newest furry friend. Building functionality that allows users to favorite items or submit forms are both important features in web development, so this was a hands-on
application for many core concepts of the module.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/ICNC3sDebeY" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/ICNC3sDebeY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>
<section class="module-card be-project-card">

<section class="module-card fe-project-card">
<h3>Module 3</h3>
<p>Module 3 pushes students look beyond the basics of building Rails web applications with the intent of taking a business need
and turning it into working software. Students integrate third party APIs,
produce APIs, build Rails applications that consume and process data, and improve the
performance of their app through caching, background workers and some front end JavaScript.</p>
<p>In Module 3, students step beyond the simple one-language-one-framework monolith and juggle multiple domains of responsibility. To build truer full-stack applications, they’re working in at least two languages and two frameworks. It’s a picture of what work in the field looks like — taking what you know from one tech and applying it in new domains.</p>
<div class="project">
<p><strong>Student Project:</strong> In Module 3, students are able to choose the topic and content of the project as long as they implement certain
technologies. This sample project was built by a team of 4 students over several weeks. It is built with the Rails framework and gets data from ProPublica and a News API. It also integrates with Twitter.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/8KRmOYamz3c" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
technologies. This sample project was built by a team of 4 students over several weeks. It is built with the Rails framework and gets data from ProPublica and a News API. It also integrates with Twitter.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/8KRmOYamz3c" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>

<section class="module-card be-project-card">
<h3>Module 4</h3>
<p>In Module 4, students work in full-stack (Front End <em>and</em> Back End) engineering teams to emulate a professional working environment. Students are expected to apply all of the technical and professional development concepts they have learned throughout
the program in order to extend and refactor existing production quality code as well as create new web and mobile
applications from start to finish. In addition, students refine their behavioral and technical interviewing skills
through weekly group and solo practice, networking and outreach with industry professionals, and self-reflection.</p>
<p>Then, in Module 4, students will choose to "major" in Front End with Javascript/React or Back End with Ruby/Rails. But we'll also emphasize branching out – maybe an FEE major decides to specialize in Angular or a BEE student dives into Python and Django. Along the way, they collaborate in teams on bigger Capstone projects that can mix and maximize all their diverse interests. And we’re excited to integrate outside experts to offer special sessions on subjects like Site Reliability Engineering, SDET, and Application Monitoring and Performance.</p>
<div class="project">
<p><strong>Student Project:</strong> This mobile application was built by 3 End students and 1 Front End student
during their last 2 weeks before graduation. They worked with a project manager and used agile practices resembling an
engineering team in the industry.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/N3UlJqEU40E" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<p><strong>Student Project:</strong> This mobile application was built by 4 students
during their last 2 weeks before graduation. They worked with a project manager and used agile practices resembling an engineering team in the industry.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/N3UlJqEU40E" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="project">
<p><strong>Student Project:</strong> This sample project uses React and Redux, a network request to the Wordnik API, and was fully tested. While the features in this project may appear to be less robust than the Module 2 project, it uses more sophisticated technologies. This project was built by one student in about 5 days.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/h2kL1GpOW6c" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

</section>

</div>

</div>
</section>

</div>

0 comments on commit 4d566e2

Please sign in to comment.