Skip to content
This repository has been archived by the owner on Nov 5, 2023. It is now read-only.

B-Salinas/All-Things-App-Academy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Assessments

2021-01-11-Cohort

Assessments/
 └── 2021-01-11-Cohort/
      ├── Module-3/
      │    ├── assessment-8/
      │    │    ├── Graph-Project/
      │    │    ├── images/
      │    │    ├── FR-Network-Devices.md
      │    │    └── Multiple-Choice.md
      │    └── assessment-9/
      │         ├── AJAX-Project/
      │         ├── CSS-Properties-Project/
      │         ├── FR-Media-Query.md
      │         └── Multiple-Choice.md
      │  
      ├── Module-4/
      │    ├── assessment-10/
      │    │    ├── SQL-Project/
      │    │    ├── Sequelize-Project/
      │    │    ├── FR-Define-A-Table.md
      │    │    ├── FR-Unique-Constraint.md
      │    │    └── Multiple-Choice.md
      │    ├── assessment-11/
      │    │    ├── express-application-a-master/ **Rename
      │    │    └── Multiple-Choice.md
      │    └── assessment-12/
      │         ├── FR-API-Design.md           
      │         └── Multiple-Choice.md   
      │
      ├── Module-5/
      │    ├── assessment-14/
      │    ├── assessment-15/
      │    └── assessment-16/
     

2020-12-07-Cohort

Assessments/
 └── 2020-12-07-Cohort/
      └── Module-3/
           ├── assessment-7/
           │    ├── Algorithms-Problems/
           │    ├── Data-Structures-Problems/
           │    └── Multiple-Choice.md
           ├── assessment-8/
           │    ├── Graph-Project/
           │    ├── images/
           │    ├── FR-Network-Devices.md
           │    └── Multiple-Choice.md
           └── assessment-9/
                ├── AJAX-Project/
                ├── CSS-Properties-Project/
                ├── FR-Media-Query.md
                └── Multiple-Choice.md

2020-11-02-Cohort

Assessments/
 └── 2020-11-02-Cohort/
      ├── Module-1/
      │    ├── assessment-1/
      │    │    ├── Calculator.md
      │    │    ├── FR-Asking-Questions.md
      │    │    ├── Highest-Average.md
      │    │    └── Multiple-Choice.md
      │    ├── assessment-2/
      │    │    ├── Creating-Files-Project/
      │    │    ├── Spec-Problems/
      │    │    ├── FR-Variable-Declarations.md
      │    │    └── Multiple-Choice.md
      │    └── assessment-3/
      │         ├── Spec-Problems/
      │         ├── FR-Event-Loop-Message-Queue.md
      │         ├── FR-First-Class-Objects.md
      │         ├── FR-Sync-Vs-Async.md
      │         ├── Interpolate-Strings.md
      │         └── Multiple-Choice.md
      │
      ├── Module-2/
      │    ├── assessment-4/
      │    │    ├── Basic-DOM-Project/
      │    │    └── Multiple-Choice.md
      │    ├── assessment-5/
      │    │    ├── Test-Driven-Problems/
      │    │    ├── Create-A-Parent-Class.md
      │    │    ├── Define-A-Class.md
      │    │    └── Multiple-Choice.md
      │    └── assessment-6/
      │         ├── Test-Driven-Problems/
      │         ├── images/
      │         └── Multiple-Choice.md
      │
      ├── Module-3/
      │    ├── assessment-7/
      │    │    ├── Algorithms-Problems/
      │    │    ├── Data-Structure-Problems/
      │    │    └── Multiple-Choice.md
      │    ├── assessment-8/
      │    │    ├── Graph-Project/
      │    │    ├── images/
      │    │    ├── FR-Network-Devices.md
      │    │    └── Multiple-Choice.md
      │    └── assessment-9/
      │         ├── AJAX-Project/
      │         ├── CSS-Properties-Project/
      │         ├── FR-Media-Query.md
      │         └── Multiple-Choice.md
      │
      └── Module-4/
           └── assessment-10/
                ├── SQL-Project/
                ├── Sequelize-Project/
                ├── images/
                ├── FR-Define-A-Table.md
                ├── FR-Unique-Constraint.md
                └── Multiple-Choice.md

2020-10-05-Cohort

Assessments/
 └── 2020-10-05-Cohort/
      └── Module-1/
           ├── assessment-1/
           │    ├── Coding-Problems.md
           │    ├── FR-Asking-Questions.md
           │    └── Multiple-Choice.md
           └── assessment-2/
                ├── Creating-Files-Project/
                ├── Spec-Problems/
                ├── FR-Variable-Declaration.md
                └── Mutliple-Choice.md

Learning Objectives

Learning-Objectives  
 ├── Module-1  
 │    ├── week-1.md
 │    ├── week-2.md
 │    └── week-3.md
 │
 ├── Module-2
 │    ├── week-4.md
 │    ├── week-5.md
 │    └── week-6.md
 │
 ├── Module-3
 │    ├── week-7.md
 │    ├── week-8.md
 │    └── week-9.md
 │
 └── Module-4
      ├── week-10.md
      └── week-11.md
      

Notes

2021-01-11-Cohort

Notes
 └── 2021-01-11-Cohort

2020-12-07-Cohort

Notes  
 └── 2020-12-07-Cohort
      └── Module-3
           ├── Week-7
           ├── Week-8
           └── Week-9

2020-11-02-Cohort

Notes
 └── 2020-11-02-Cohort
      ├── Module-1
      │    ├── Week-1
      │    ├── Week-2
      │    └── Week-3
      │
      ├── Module-2 
      │    ├── Week-4
      │    ├── Week-5
      │    └── Week-6
      │
      ├── Module-3
      │    ├── Week-7
      │    ├── Week-8
      │    └── Week-9
      │
      └── Module-4
           └── Week-10

2020-10-05-Cohort

Notes
 └── 2020-10-05-Cohort
      └── Module-1
           ├── Week-1
           ├── Week-2
           └── Week-3

Other

Checks Your Current Environment

curl -s https://raw.githubusercontent.com/appacademy/aa-setup-checker/master/run.sh | bash

Updating Brew in Terminal Command

brew update  
brew upgrade  
brew install nvm  
from your home folder~~~~~~~  
code .zshrc  
place in the .zshrc file~~~~~~~~~  
export NVM_DIR=~/.nvm  
source $(brew --prefix nvm)/nvm.sh  
quit terminal, reopen~~~~~~~~~~  
nvm --version  
~should be 0.35.3~  
nvm install --lts 

Updating Heroku Everything

heroku pg:reset -a ygo-da-deck-builder --confirm ygo-da-deck-builder && heroku run -a ygo-da-deck-builder flask db upgrade && heroku run -a ygo-da-deck-builder flask seed all

Putting this here

W14D2 React Basics & React Router https://vimeo.com/manage/videos/536537238 EOD: https://vimeo.com/536583505/ef78983a68 W14D3 Basic Hooks https://vimeo.com/536971788/8682985dc7 EOD https://vimeo.com/537041794/a7b29eda68 W14D4 React Context w/Miah https://vimeo.com/537373618/5473820771 EOD https://vimeo.com/537511834/5341a5ca4c W15D1 Class Component Lecture: https://vimeo.com/538903882/33d96ea898 EOD: https://vimeo.com/538923936/7530933ba6 W15D2 React-Redux https://vimeo.com/539378173/2a68ed6b17 EOD: https://vimeo.com/539413799/aa809411cb W15D3 W15D4 Fullstack Dataflow: https://vimeo.com/540417329/29282a23aa

more things

docs: https://react-redux.js.org/api/hooks useSelector

  • takes in a callback function as an argument
    • that callback receives the current "state" that your redux store is managing
    • the return value here is what
  • returns the effect of the callback(return value of cb) useDispatch
  • takes in no arguments(normally)
  • returns a dispatch function(object)
  • we only need this to later be able to send things to our store reducers
  • just functions
  • input: 1st: state, 2nd: the argument we passed to our dispatch function
    • 1st argument of state is the previous reducer function return value
  • return: what the slice of state that this reducer is managing should look like
    • the structure of this object/array should stay consistent
  • the combined output of all our reducers creates the combo object that represents our global state state management library on the frontend redux cycle steps setup:
    • create a store(single source of data truth on front end) - configureStore - usually in a store.js file
    • write reducer functions(determining the structure of what our store looks like)
    • install react-redux package
      • useSelector, useDispatch hooks
    • Provider component around all parts of our app that will need access to store implementation(start from a component):
  • seeing content on the page
    • React- component gets rendered
      • react will request(from store) information this component needs - useSelector
    • once it has the info from store, will then render on page
  • changing content on the page
    • need access to the dispatch
      • const dispatch = useDispatch();
      • dispatch has 1 job: send things to the redux store(hits reducers as 2nd argument)
    • dispatch()
      • the info passed as an argument to dispatch, is the argument that will be passed to all my reducers in the future

thunk:

  • ensure that only pojo get sent to our reducers(store) useSelector
  • input argument: callback function
    • that input argument will be the global "state" present in our app
  • whenever we see useSelector, it's because we're trying to access information from our store useDispatch()
  • main function is to get access to dispatch when submitting a form(walking through data flow)
  • clicking "submit" button
  • invokes our handleSubmit function(written in this component)
  • we use the dispatch, and the createPokemon thunk action creator
    • dispatch(createPokemon(payload))
    • we are dispatching(to our store) the return value of createPokemon(payload)
      • this happens to be another function
  • because we tried to dispatch a function to our store, thunk sees this and instead of allowing function through to our store, it redirects
    • redirects: calling the function that tried to go to store and passing dispatch as argument to that function
  • this function that thunk is going to invoke and pass the dispatch argument to is typically our BE fetch requests
  • we make the request to our BE service
    • it does stuff with our database
      • save a pokemon
    • returns a response with results of trip to DB
  • we use the dispatch that thunk passed as argument to this function
    • we dispatch the return value of the action creator
      • dispatch(addOnePokemon(pokemon))
    • this action object(return vlaue of action creator) gets sent to our reducers
  • our reducers see the action object and decide if they know what to do with it
    • in this case: it adds the one pokemon we just created to our global state
    • return the new slice of state wih the new pokemon added
  • each component that is utilizing some part of our global state, a re-render is triggered by redux(not us) whenever our global state changes/updates
    • const pokeTypes = useSelector(state => state.pokemon.types);
  • once component is triggered to re-render
    • all the react stuff happens again

keep the resources coming

https://github.com/gootieno/thunks-lecture https://github.com/jshafto/week_18_demo