Skip to content

Instantly share code, notes, and snippets.

@AllanSaleh
Last active November 22, 2022 15:41
Show Gist options
  • Save AllanSaleh/4f0ca0feb2e3fc81a98e57cfd76c42aa to your computer and use it in GitHub Desktop.
Save AllanSaleh/4f0ca0feb2e3fc81a98e57cfd76c42aa to your computer and use it in GitHub Desktop.
  1. Each person in your group should take one of the following topics and explain it to the group in their own words. Be sure to provide concrete examples in your explanations. For the remaining topics, discuss them as a whole group.
  • Node Package Manager
  • Imperative vs Declarative
  • Components
  • JSX
  • Imports and Exports
  • Props
  1. When would you use props in react?
  2. Assuming UserDetail is a component, what will it's props be if it's rendered as follows:
const user = {name: 'Spider Man', age: 32}

<UserDetail title="Profile Page" dog="Fido" user={user} />
@Omer-Amr
Copy link

1-a. is a managment tool so we can use it in our application to input some packages like libraries on frameworks.
1-b. Declarative programming is a programming paradigm … that expresses the logic of a computation without describing its control flow. Imperative programming is a programming paradigm that uses statements that change a program's state.
1-c. Reusable peices of code.
1-d. JSX stands for JavaScript XML. JSX allows us to write HTML in React. JSX makes it easier to write and add HTML in React.
1-e. Importing allows using contents from another file, whereas exporting makes the file contents eligible for importing.
1-c. Props are arguments passed into React components.

  1. We use props in React to pass data from one component to another "from a parent component to a child componen", They are useful when you want the flow of data in your app to be dynamic.
  2. it will props the user.

@batoulst
Copy link

1:
-NPM: is the largest library to download packages
-Imperative vs Declarative: Imperative will use the real DOM (getElement...append..)
Imperative programming is like giving a chef step-by-step instructions on how to make a pizza. Vanilla JavaScript is an example of Imperative programming. Declarative programming is like ordering a pizza without being concerned about the steps it takes to make the pizza.
-Components are independent and reusable bits of code. They serve the same purpose as JavaScript functions, but work in isolation and return HTML. Components come in two types, Class components and Function components, in this tutorial we will concentrate on Function components.
-JSX: javascriptXML which allow us to write HTML in REACT
-Imports and Exports: Importing and exporting in React JS will help us write modular code, i.e., splitting code into multiple files. Importing allows using contents from another file, whereas exporting makes the file contents eligible for importing.
-props: using properties to change the information inside components as we wish.

2-use props to pass data from one component to another one, it is like the arguments of JS functions
3-the props will be : title ,dog ,user

Sena,Miray,Ahmad,Batoul

@akbulatesra
Copy link

Declerative=> Telling the computer what do you want to do without caring about the details
Imperative => Telling the computer step by step what should it do and what are you expecting on return

@helintoptanci
Copy link

NPM: it is an online repository for the publishing of open-source Node.js projects. we can avoid coding the same thing which is already written by another developer, just by installing npm and applying it to the project.
Imperative vs Declarative: Imperative programming is like giving instructions step-by-step on
how to operate a certain function. Declarative programming is like using a function without being concerned about the steps.
Components: they are the block elements of a webpage. they are re-usable. for example navbar, footer, sections etc. these components do no effect each other.
JSX: JavaScript XML. It allows us to put HTML into JS. It is an extension of React. Example: const element =

Hello World


Imports and Exports: This is the way to communicate with the components. You can export component that you want to use in another place. and in that place you can import what you want to use.
Props: We use props in React to pass data from one component to another (from a parent component to a child component(s)). Props is just a shorter way of saying properties.
they are objects that we assign to functions in react as an input. later on we can use these props in the function itself to define what will be shown on the screen. example:
function Welcome(props) {
return

Hello, {props.name}

;
2- They are useful when you want the flow of data in your app to be dynamic.
3- name and age

Copy link

ghost commented Nov 22, 2022

  1. npm is a package manager for JavaScript. This means that npm works with your JavaScript project directories
  2. Imperative : Explicitly describes the actions a program should take, each step of the way
    Declarative: Describes what a program should accomplish
  3. Components let you split the UI into independent, reusable pieces.
  4. JSX is a React extension to the JavaScript language syntax which provides a way to structure component rendering using syntax familiar to many developers. It is similar in appearance to HTML.
  5. when you're trying to use react component you need to export it from the component file and imported in the file you want to use it in
    6.React Props are like function arguments in JavaScript and attributes in HTML.
  • When we use components we can use props to access to data in children
  • title, dog, user

Copy link

ghost commented Nov 22, 2022

  1. --npm is the default package manager for the JavaScript runtime environment Node.js.
    --The export declaration is used to export values from a JavaScript module. Exported values can then be imported into other programs with the import declaration or dynamic import. The value of an imported binding is subject to change in the module that exports it — when a module updates the value of a binding that it exports, the update will be visible in its imported value.
    ---props get passed to the component (similar to function parameters) whereas state is managed within the component (similar to variables declared within a function)

  2. make components reusable by giving components the ability to receive data from their parent component in the form of props.

  3. Profile Page Fido 'Spider Man' 32.

@halilibrahimcelik
Copy link

  1. NPM is a command line tool that installs, updates or uninstalls Node. js packages in your application.
  2. Imperatives programming is like step by step instruction and Declarative is the instruction.
  3. Components single and reusable fragments of React.
  4. JSX is combination of JS and HTML
  5. Imports and Exports are used for importing and exporting modules for third party languages and tools
  6. props are objects passed through react components

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