wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

Frontend - CTO Cup

Total questions: 20

Worksheet time: 15mins

Name
Class
Date
1.

What is in the console?

a)

1

b)

2

c)

9

d)

undefined

2.

What is in the console?

a)

1

b)

0

c)

"true"

d)

true

3.

What is in the console?

a)

true

b)

false

4.

What is in the console?

a)

string

b)

number

c)

1

d)

true

5.

What is in the console?

a)

NaN

b)

3

c)

5

d)

7

6.

Who is this?

b)

Dan Abramov

c)

Minko Gechev

d)

John Papa

7.

Who is this?

b)

Dan Abramov

c)

Minko Gechev

d)

John Papa

8.

Who is this?

b)

Dan Abramov

c)

Minko Gechev

d)

John Papa

9.

Who is this?

b)

Addy Osmani

c)

Dmytro Mezhensky

d)

John Papa

10.

What is the main goal of Cross-Site Scripting (XSS) attacks?

a)

To inject malicious SQL queries into a database

b)

To trick users into providing sensitive information

c)

To execute malicious scripts in the victim’s browser

d)

To force users to change their passwords

11.

Which of the following methods helps prevent Cross-Site Request Forgery (CSRF)?

a)

Using a CAPTCHA

b)

Adding a CSRF token to forms

c)

 Implementing password complexity rules

d)

Validating the format of input fields

12.

How can a frontend developer help prevent XSS attacks?

a)

By validating user input on the client-side

b)

By escaping or sanitizing HTML content

c)

By disabling JavaScript in the browser

d)

By using strong encryption on all forms

13.

How does the Content Security Policy (CSP) header help mitigate security risks like XSS?

a)

It prevents users from submitting forms without validation

b)

It restricts the types of resources (e.g., scripts) that can be loaded on a webpage

c)

It forces users to log in using multi-factor authentication

d)

It encrypts data sent between the browser and the server

14.

How does React’s useMemo hook help optimize performance in a component?

a)

 By memoizing component rendering

b)

By preventing re-rendering of child components

c)

 By caching the results of expensive function calculations between renders

d)

By avoiding side effects in functional components

15.

 What happens when you pass a function as the second argument to setState in a class component?

a)

The function will be executed after the state has been updated

b)

The function will replace the current state instead of merging it

c)

The function receives the previous state and props, and updates state based on them

d)

The function is used to force the component to re-render immediately

16.

What is the primary purpose of React’s useEffect hook?

a)

To manage component state

b)

To handle side effects in functional components

c)

To define how a component should render

d)

To create a context for global state management

17.

What is the virtual DOM in React?

a)

 A real-time copy of the browser’s DOM

b)

A lightweight representation of the real DOM for improved performance

c)

A database for storing React components

d)

A debugging tool used by React developers

18.

What is NOT a state management library?

a)

Zustand

b)

MobX

c)

Redux

d)

Fuse

19.

What is the difference between getStaticProps and getServerSideProps in Next.js?

a)

getStaticProps runs at build time, while getServerSideProps runs on every request

b)

getStaticProps is for client-side data fetching, while getServerSideProps is for server-side fetching

c)

getStaticProps is used for API routes, while getServerSideProps is used for page routes

d)

There is no difference; they are interchangeable

20.

What feature of Next.js allows for both static generation and server-side rendering in the same application?

a)

Incremental Static Regeneration (ISR)

b)

Dynamic Routing

c)

Static Exports

d)

Client-Side Rendering (CSR)