Day 31 of 100 Days Of Code

Image of reactjs

Day 31: August 24, Friday

Today ‘s Progress: I finished work on Introduction to the Sass Challenges and started on React.js Introduction to the React Challenges.

Thoughts: The Introduction to the Sass Challenges at first seemed pretty buggy but I can confirm it makes a big difference to use Chrome. I used Chrome to get though the last challenges and had no issues.

Resources used:

//Introduction to the React Challenges:
//Create a Simple JSX Element
//JavaScript within curly braces: { 'this is treated as JavaScript code' }
//under the hood the challenges are calling ReactDOM.render(JSX, document.getElementById('root'))
const JSX = <h1>Hello JSX!</h1>;


//Create a Complex JSX Element
const JSX = (<div>
             <h1>Heading One</h1>
             <p>Paragraph Two</p>
             <ul>
               <li>List one</li>
               <li>List Two</li>
               <li>List Three</li>
             </ul>
            </div>);


//Add Comments in JSX
const JSX = (
  <div>
    <h1>This is a block of JSX</h1>
    {/* This is a comment! */}
    <p>Here's a subtitle</p>
  </div>
);

This is something new not sure how I feel about it yet.

Link(s) to work

  1. Finished work on Introduction to the Sass Challenges.

Introduction to the Sass Challenges

  • PassedUse @each to Map Over Items in a List
  • PassedApply a Style Until a Condition is Met with @while
  • PassedSplit Your Styles into Smaller Chunks with Partials
  • PassedExtend One Set of CSS Styles to Another Element

All code is in GitHub and Sass meister here: Sass meister Johnny’s gist or FCC-introductionToTheSassChallenges.sass

  1. Started work on Introduction to the React Challenges learning React.js.

Introduction to the React Challenges

  • PassedCreate a Simple JSX Element
  • PassedCreate a Complex JSX Element
  • PassedAdd Comments in JSX

All code is in GitHub and validated at repl.it here: Repl.it/ Johnny’s/ FCCReactjs or FCC-Introduction to the React Challenge.

Written on August 24, 2018