MMateus Felipe/hideoutv10
  • About
  • Writing
  • Projects
  • Books
GitHub
All postsNote·May 04, 2021

01Note

NLW#5 - React Notes

React notes write during NextLevelWeek #5 of the Rocketseat

Mateus Felipe Gonçalves

@mateusfg7

nlw5rocketseatwebssrssgtipsnext.js
Note
NLW#5 - React Notes

CSS

Y-Scroll just to a component

You need to set a fixed height

.component {
  height: 100vh;
  overflow-y: scroll;
}

Use "..." when the text exceed component width

.component {
  text-overflow: ellipsis;
}

JS

Ternary If/Else

a = 1
b = 2
 
c = a == 1 ? a : b

without "else"

a = 1
b = 2
 
c = a == 1 && a

just the "else"

a = 1
b = 2
 
c = a != 1 || b

referencies

Rocketseat: https://rocketseat.com.br/

On this page

  • CSS
    • Y-Scroll just to a component
    • Use "..." when the text exceed component width
  • JS
    • Ternary If/Else
  • referencies

02Comments

Join the conversation.

Questions, corrections or a different take? Sign in with GitHub or Google and leave a note below.

Comments need a login

Loading comments...

Thread

00 comments

Session

Not signed in. Sign in with GitHub or Google to comment, reply and react.

03Keep reading

Related posts.

Note·Nov 28, 2023

Mock "next/navigation" with Jest

Note
Mock "next/navigation" with Jest
Mateus Felipe

Mateus Felipe

@mateusfg7

reactnext.js

Note·Nov 28, 2023

Mock module inside test

Note
Mock module inside test
Mateus Felipe

Mateus Felipe

@mateusfg7

reactnext.js

Note·Feb 12, 2024

Intentional Hover Effects

Note
Intentional Hover Effects
Mateus Felipe

Mateus Felipe

@mateusfg7

csseffects
MMateus Felipe

Full stack by day, root user by night. Notes, projects and experiments from my corner of the internet.

contato@mateusf.comWhatsApp +55 37 99995-7218

01Pages

  • Home
  • About
  • Writing
  • Projects
  • Books
  • Sitemap

02Elsewhere

  • GitHub
  • LinkedIn
  • Reddit
  • Instagram
© 2026 Mateus Felipe Gonçalvesv9.mateusf.com