Log In Screen

[mwhite192]

@AccessiT3ch - Hey again Conor! My second question is was it correct/best to create a component for each 'item' of the log in screen? There is a component for all buttons, forms, and images. I just want to make sure my thought process is correct as I was thinking its best to create a component for each element and them import them to the App.js file.

[AccessiT3ch]

@mwhite192 I think that sounds just fine, ultimately deciding where / how to delineate UI into components and subcomponents is a bit of a balance of a couple factors.

• Modularity - Is the UI going to be used elsewhere? If so, then it can probably be a subcomponent
• Functionality - Is the UI responsible for executing something? Does the UI require any state management? Are these things that the parent component isn't responsible for? If so then probably it can be a subcomponent
• Size and Scope - If a component such as your footer is big and/or complex enough, it could be broken down into sub components. If it's less than a few dozen lines and isn't responsible for doing much, it could be left as a single basic component
• Instinct - How does it feel? If you are constantly scrolling, getting lost in the file, or need to open your file in multiple screens then you might need some subcomponents (if possible) and / or utility / helper functions

I find navigating this balance to be an ongoing process most of the time :)

[mwhite192]

@AccessiT3ch - I think this is something we might have to talk about the session because I am a little confused. Seeing it in my code might help me to better understand how to find the balance between components and subcomponents. In terms of size and scope, I understand that because my footer isn't that big as it is essentially a button that performs a function and an image.

[AccessiT3ch]

Fortunately there's no wrong way to start, and a lot of this becomes more clear as we develop the functionality :)