A string is a series of characters, such as “hello, world” or “good bye!”. Swift strings are represented by the String type. The contents of a String can be accessed in various ways, including as a collection of Characters values.

Content

  1. String Literals
  2. Working with Characters
  3. Concatenating Strings and Characters
  4. String…

An operator is a special symbol or phrase that you use to check, change, or combine values. For example, the addition operator (+) adds two numbers, and the logical AND operator (&&) combines two Boolean values.

let i = 1 + 2
if student && male

Content

  1. Terminology
  2. Assignment Operator
  3. Arithmetic…

Contents

  1. Boolean
  2. Tuples
  3. Optionals
  4. Error Handling
  5. Assertions and Preconditions

1. Boolean

Swift has a basic Boolean type Bool which refers to be as logical, because they can only be true or false.

let orangeIsOrange = true
let appleIsOrange = false

You can work with conditional statements such as the if statement

if appleIsOrange…

Contents

  1. Constants and Variables
  2. Comments
  3. Semicolons
  4. Integers and Floating-Point Numbers
  5. Type Safety and Type Inference
  6. Numeric Literals
  7. Numeric Type Conversion
  8. Type Aliases

1. Constants and Variables

Let -> Constants (Won’t change)

Always declare as a constant if the stored value won’t change.

let maximumWeight = 30

Var -> Variables (Can be changed)

var currentWeight = 10

Declare multiple constants , variables

let x = 0.0, y…

We can’t use async & await directly to the useEffect hook

Wrong usage of async & await

useEffect(async () => {
const {data} = await Axios.get("/api/products");
setProducts(data);
}, []);

How to Fix?

  1. Create a function inside useEffect hook
useEffect(() => {
const fetchProducts = async () => {
const {data} = await Axios.get("/api/products");
setProducts(data);
};
fetchProducts();
}, []);

2. Create a function outside usdeEffect hook

useEffect(fetchProducts, []);

async function fetchProducts() {
const {data} = await Axios.get("/api/products");
setProducts(data);
}

Directory Structure

shop (root directory)

package.json (node)

— — client (frontend directory)

— — — — package.json (react)

In client’s package.json

Add following code

"proxy": "http://localhost:5000"

In root directory’s package.json

Add following code

"devDependencies": {
"nodemon": "^2.0.6",
"concurrently": "^5.3.0"
},
"scripts": {
"server": "nodemon server.js",
"client": "cd client && npm start",
"dev": "concurrently \"npm run client\" \"npm run server\""
},

Now, run both React & Node.

npm run dev

const Rating = ({value, color}) => {
return (
<div className='rating'>
<span>
<i style={{color}}
className={value >= 1 ? "fas fa-star" : value >= 0.5 ? "fas fa-star-half-alt" : "far fa-star"}/>
</span>
</div>
);
};
Rating.defaultProps = {
color: "#f8e825"
};

Use color value with props passed by Parent component

Or use default color value

Jay Han

IOS React Dev

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store