Skip to content

Instantly share code, notes, and snippets.

@halitbatur
Created October 12, 2023 13:36
Show Gist options
  • Save halitbatur/5e6f50609b99f87964f9af510a5d8a70 to your computer and use it in GitHub Desktop.
Save halitbatur/5e6f50609b99f87964f9af510a5d8a70 to your computer and use it in GitHub Desktop.
React Discussion Questions

React Discussion questions

  1. What problems does React aim to solve?
  2. How might React differ from other JavaScript frameworks or libraries you've heard of?
  3. How might building an application with components be advantageous?
  4. How does React's Virtual DOM differ from the actual DOM, and why might this be beneficial?
  5. How does JSX combine JavaScript and HTML-like markup?
  6. How does a traditional website differ from a Single Page Application?
  7. Why might developers choose to build an SPA using React?
  8. How might an application's data or user interface be affected by changes over time?
  9. How do you think React manages this dynamic data?
@Hassan-AbuGareeb
Copy link

Team members: Hassan, Ammar kolko, feda baqin, nour kayyali, yasin aji.
1- -allows developer to build complex user interface in which components change overtime (so we won't have to write hard coded js code).
-building interactive user interfaces and web applications quickly and efficiently with significantly less code than you would with vanilla JavaScript

2- -React uses a declarative approach to building UI, which means you describe what you want your UI to look like, and React takes care of the rest
-React separates the user interface into numerous components, making debugging more accessible, and each component has its own set of properties and functions
-React uses a virtual DOM it reduces the number of DOM manipulation operations that need to be performed.
-flexible library. It can be used to build a variety of different types of web applications.

3- Reusable Components
One of the main benefits of using React JS is its potential to reuse components. It saves time for developers as they don't have to write various codes for the same features. Furthermore, if any changes are made in any particular part, it will not affect other parts of the application.
-Easier Maintenance
-Improved Scalability.

4- -The virtual DOM is a lightweight representation of the actual DOM
-In summary, the main difference between the DOM and the virtual DOM is that the DOM is the actual representation of a web page's structure and content, while the virtual DOM is an abstract, lightweight copy of the real DOM that can be used to optimize and speed up web development and rendering.
-----
5- -JSX is a syntactic enhancement for javascript ,combines JavaScript and HTML-like markup by allowing you to write HTML-like code inside of JavaScript files
-JSX in React enables you to write HTML in it, making the code simpler for you to build user interfaces for your online apps.
-example: const element =

Writing markup with JSX.

;
----
6- Single-page applications are more modern and robust than traditional apps. SPAs support rich, client-facing functionality without reloading the page each time a user performs an action. They also load faster than their traditional counterparts by fetching data using APIs.
-The browser loads a single HTML page and then dynamically updates that page as the user interacts with the application.
-It is recommended to use SPA in websites rich with user interface elements, as it offers a faster page reload.

7- react is component based which helps with reusability, performance, and maintenance.
-Backed by an active community of developers.
-Rich user interface development.
-The application built using react is highly testable, facilitating faster development and delivery of apps. It is one of the top reasons why it is preferred by enterprises looking to release their web app faster to the market while ensuring better quality.

8- in React case the changes can be predicted because React uses components approach.
-
--
9-Real-Time Updates:

If your application includes real-time features, such as chat or live notifications, changes pushed from the server will affect the user interface. WebSockets or server-sent events can be used to handle real-time updates in React.

@Sanad-Alshobaki
Copy link

Room number: 12
written by:
Raneem, Sanad, Farah, Amany

Q1:
React make dynamic application easier to write, and build a user interface that relies on changing data.

Q2:
Instead of costly direct DOM updates, React uses a virtual DOM to efficiently render changes, Server-side rendering: Boosts performance and SEO (search engine optimization)

Q3:
Using components in apps is like using building blocks; it's easier to assemble, and change, and everyone can work together smoothly.

Q4:
Real DOM is what you see on your browser screen and virtual DOM is a copy of it, but it's lighter and faster.
React can make web pages feel quicker and more responsive because updating the real DOM directly often takes more time.

Q5:
JavaScript XML: is a JavaScript syntactic extension that allows you to construct HTML-like content within a JavaScript file.

const element = ;

Q6:
SPAs support rich, client-facing functionality without reloading the page each time a user performs an action. They also load faster than their traditional counterparts by fetching data using APIs.

Q7:
Because of using React's fast virtual DOM and component-based design, developers can easily build sophisticated and responsive web apps.

Q8:
Over time, an application's data and user interface can change due to user interactions, software updates, external data shifts, and feedback. Essentially, as technology, user needs, and external factors evolve, applications must adapt, leading to changes in how they look and function.

Q9:
React uses a virtual DOM to efficiently update the UI when data changes, enabling dynamic content rendering with minimal refreshes.

@momena01
Copy link

1- React is a popular JavaScript library for building user interfaces, and it aims to solve several problems related to building complex and interactive web applications. Some of the problems that React addresses include Complex UIs, Virtual DOM, and State Management.
2- i- Declarative approach: This can make it easier to understand and reason about your code, as you don’t have to worry about the underlying implementation details. ii- Virtual DOM: This can make React apps faster, reducing the number of DOM manipulation operations needed.
3- Reuseable: you can use the same component in multiple application parts or even across different projects.
Modularity: A complex user interface can be divided into smaller components making it easier to understand and maintain.
4- Actual DOM: Direct Manipulation: When you change any part of the actual DOM, the browser has to re-render the entire page, which can be slow and resource-intensive.
Virtual DOM: Indirect Representation: When changes are made in a React application, they are first applied to the Virtual DOM, not the actual DOM.
9-React manages dynamic data using a virtual DOM. When data changes, React calculates the minimum necessary updates and re-renders only the parts of the user interface that need to change.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment