1.2.tsx

/***************** Importing and Exporting Components *********************/

// - Split components into different files

// - Next.js root component is different for every page

// - If importing, you don't have to put `.js` at the end of filename

/* - A file can have no more than one default export, but it can have as many named exports as you like. */

/* - When you write a default import, you can put any name you want after import. For example, 
you could write import Banana from './button.js' instead and it would still provide you with the same 
default export. */

/* - People often use default exports if the file exports only one component, and use named exports if 
it exports multiple components and values */

// - Always give meaningful names to your component functions and the files that contain them

// - A file can only have one default export, but it can have numerous named exports!

/* - To reduce the potential confusion between default and named exports, some teams choose to only 
stick to one style (default or named), or avoid mixing them in a single file. Do what works best for you! */