Below is the pre-work for Code the Dream’s advanced (React.js, Ruby on Rails, Node.js/Express) classes.
- It will take around 15-20 hours total time.
- You have two weeks to complete the work, but the work is similar to the amount of time you should plan to spend on our class during ONE typical week.
- Please complete the pre-work submission form by 11:59pm on Sunday night of the deadline to be considered for the class.
- If you have any questions on the material, please don’t hesitate to reach out. We’re here to help! Email your questions to classes@codethedream.org
Part 1: Preparation (approx. 45-60 mins)
For Part 1: Preparation, you will complete four tasks:
1. Watch the Intro Video.
2. Read the article about growth versus fixed mindsets and answer the 2 discussion questions.
3. Read the article about web developer career paths and answer the discussion question.
4. Watch the video about GitHub (a tool you will use in our classes and in your career as a
developer) and answer the discussion question.
You will put the answers to your questions in the pre-work submission form once you have completed all of the pre-work and are ready to submit. For now, type up your answers in a notepad text document, a word document, a google document, or some other convenient place. Once you complete all three parts of the pre-work assignment and are ready to submit you can copy and paste your answers into the submission form.
Preparation: Task 1 of 4 – Intro Video
If you haven’t already watched our intro video for this class, please do so below!
Preparation: Task 2 of 4 – Mindset
Programming is hard, but not impossible. In any new and challenging situation, having the right mindset can make a difference. Read the following article and then answer the question prompt.
Fixed vs. Growth: The Two Basic Mindsets that Shape Our Lives
- What is the value of having a growth mindset when learning new and complex material?
- How would a person with growth mindset respond when they fail or are stuck and don’t know what to do next?
As you go through the rest of the pre-work, keep in mind the benefits of a growth mindset. You’ll probably get stuck on something or feel a little overwhelmed, but don’t worry! Advanced programmers get stuck all the time – just ask our apprentices.
Preparation: Task 3 of 4 – Careers in Web Development
Code the Dream trains people to be web developers. If you’re new to programming, it might not seem immediately clear what a web developer does. This quick post from the Odin Project gives you a brief overview of the job description and work environment of a web developer. After you read it, think about the question below and write a short paragraph with your response.
- What are your career goals? In what type of work environment can you see yourself working? Why?
Preparation: Task 4 of 4 – GitHub
GitHub is one of the essential tools that you’ll use as a developer, and you will be using it regularly as a Code the Dream student. Watch the video and use your own words to describe what GitHub is.
- What is GitHub and how do you see its importance?
PART 2: RESOURCES (if needed)
GitHub Resources
Knowing how to use GitHub and upload your work is a requirement for CTD’s advanced classes. If you are proficient in programming fundamentals, but you don’t know how to use GitHub, you can do one of these tutorials:
- https://docs.github.com/en/github/getting-started-with-github
- https://product.hubspot.com/blog/git-and-github-tutorial-for-beginners
- https://lab.github.com/githubtraining/introduction-to-github
Feel free to go through these to help learn the system. We do require your pre-work submission to be in GitHub.
JS and API Fetch Resources
Some of you may already be familiar or comfortable with JavaScript, but could use a little help with the API fetch portion. Feel free to utilize these resources as you work on your pre-work:
- https://www.javascripttutorial.net/javascript-fetch-api/
- https://www.geeksforgeeks.org/how-to-use-the-javascript-fetch-api-to-get-data/
- https://www.freecodecamp.org/news/how-to-make-api-calls-with-fetch/
- https://javascript.info/
PART 3: DEMONSTRATION (15-20 hours)
Your Own Coding Project: Show us your skills!
To skip the Intro class, you need to demonstrate that you have mastered certain skills, including creating a basic page, calling an API, using HTML & CSS, and using Github.
This project provides the basic instructions for creating a project that will demonstrate these competencies by using the Star Wars API and creating a page that allows a user to navigate around the data provided from that api.
Instructions
Your assignment is to create a basic webpage displaying items from the Star Wars API (https://swapi.dev/) if the API is down use: https://www.swapi.tech/. The requirements are:
- Create the HTML for the page
- Style the elements on the page using CSS
- Retrieve the data to display on the page using JavaScript to fetch the data from the Star Wars API (or the backup option) as needed
- Provide a README file that includes the instructions for running the webpage
The content that you decide to use from the api, as well as the way it is displayed, is up to you however at a minimum it should include the following:
- Display the data for at least 2 of the models in the API (we suggest starting with people and films)
- Provide a way for the user to navigate from each model’s page to the other models that are displayed
- The simplest version of this would allow going from a person to the films they are in and from a film to the characters in that film
- Issue new GET requests for the linked data to display in the linked pages
The project should be created as a repository in GitHub and a link to the repository should be submitted for assessment in the assessment form.
Example
One example of a site would be one that displays a person, such as Luke Skywalker, based on the data that comes back from the api, in the case of Luke the api endpoint is https://swapi.dev/api/people/1/
It could show their name, and some details such as their hair color and birth year (make sure that all of the data you are trying to show exists for that entity).
Then it could show a list of films that that characters appears in using the films array that is part of the data returned with the Luke Skywalker object.
Clicking on one of the film names would take the user to a page/view that shows that film name along with some details about that film such as the release date, or if you are really adventurous it could show the opening crawl data. It would also show a list of characters that appear in that film with links to take the user to a page/view for each character.
Assessment
Areas that will be included in the assessment include:
- Can we get the code to run without issues by following the instructions in the README file
- Is the site usable to navigate between the different models it loads
- Is the code readable and well structured
- Does it handle error cases
- What type of styling was included
While we do expect to see some custom styling on the site this is primarily an assessment of coding skills and not design strength so a simple set of styling is acceptable.
Extra
The following are not necessary, but are examples of things that would be nice bonuses:
- A particularly well-designed GUI
- Display and navigation of more than 2 categories of data from the api
- Displaying all of the data associated with each model
If, after reading these instructions, you prefer to complete the Intro to Programming pre-work assignment instead and be considered for the Intro class instead of an advanced class, please see the Intro to Programming pre-work instructions here: https://codethedream.org/intro-pre-work/
Thank you, and happy coding!
SUBMISSION and NEXT STEPS
Congratulations – You’re done with the pre-work! You can either use this embedded form to submit your work
You can also use this link to open the form in a new tab or window: Code the Dream Advanced Pre-Work Submission Form
We’ll review and score each submission after the deadline and contact you with our application decisions.