Advanced Search
Search Results
211 total results found
Basic Navigation
You can read full guide and tutorial here Basic Navigation in React Page creation In page folder, we will have two page Home page and About page In main.tsx file, we will defined two paths "/" and "/about" when you direct to "localhost:5173/" , it wi...
Dynamic Routing
Dynamic routing is a powerful technique used in web development to handle navigation and rendering of pages based on changing parameters. Unlike traditional static routing, where pages are created and rendered component by component, dynamic routing allows for...
What is API ?
API (Application Programming Interface) API stands for Application Programming Interface, it's a set of defined rules that acts as an intermediary layer that enables the exchange of information and functionality between different systems, such as between a ...
React Fetching
In this course for the data, we have used is the API endpoint from https://reqres.in/api/users Fetch method The fetch() is a method in JavaScript is used to request to the server and load the information in the webpages. The request can be of any APIs th...
RESTful API
REST (Representational State Transfer) What is RESTful API? RESTful API is an interface design based on REST architecture that enable two computer systems exchange information securely over the internet either used to fetch or give some information from a ...
Deck of Cards API
Shuffle the Cards: Add deck_count as a GET or POST parameter to define the number of Decks you want to use. Blackjack typically uses 6 decks. The default is 1. Draw a Card: The count variable defines how many cards to draw from the deck. Be sure to replac...
Free Dictionary API
Search word definition and some other details. with this request format it would provide many word's details such: word - how word spell phonetic - how to pronounce word according to the phonetic principle origin - source or beginning of this word partO...
Fetching via Axios
Axios Axios package is a Javascript library not API. Axios use promise-based HTTP client designed for Node.js and browsers. so, we can easily send asynchronous HTTP requests to REST APIs and perform create, read, update and delete operations (CRUD). It is an ...
RPG theme TODO App
Now we're gonna try to do some Lab about what we've learn so far. Please follow the given instruction until the end. Objective: Understand the use of useState and Manage the state Understand concept of Component in React Understand to import and export...
Simplest Calculator
In this assessment, your goal is to build a simple calculator app. The app should be fully functional. For the CSS you don't need to do it by yourself, copy the code below and paste it on App.css in the src folder, before you paste it make sure you delete...
Bank App Home Page
Throughout this course we will try to create full stack bank app web application that fully functioning Creating Home Page The final result of this lab should look like this The home page should consist of Deposit/transfer/ withdraw card : original...
Introduce Flex box / Grid Layout Systems
Flex Box What is Flexbox? Flexbox is a layout model that allows you to distribute space and align elements within a container, even when the sizes of the elements are unknown or dynamic. Unlike traditional layout models, such as floats and positioning, F...
Bank Assignment Cont.
History Page Example of large breakpoint view. (desktop) Example of Extra small , Medium breakpoint view (Mobile) 1.Create the History page (follow this User interface) create deposit component create withdraw component create the transaction...
CSS Unit
Absolute Lengths The absolute length units are fixed and a length expressed in any of these will appear as exactly that size. Relative Lengths Relative length units specify a length relative to another length property. Relative length units scale better b...
Form Handling Exercise
Instruction Create a form that receive the 2 input and 1 submit button 1. Email 2. Password The form should validate the data with this requirement. Email The valid email should follow the HTML standard email validation HTML Standard (whatwg.org) ...
React router component
Components in React Router V6 BrowserRouter BrowserRouter is main component to cover our React application to make it routable. Used for applications with a modern browser that supports the HTML5 history API. Allows you to use regular URLs (e.g., /about)...
Bank project Cont.
For this week, we going to continue on our bank project from last week by the following goals Goals Create a main page that contain a navbar menu for redirect to home page and history page. Routing between home page, history page, sign up page and sign in...
Routing exercise
Instruction Make a page call MainPage.jsx - In main page (Parent) there will be two button that will render HomePage (Child) or AboutPage (Child) For homepage and aboutpage, just use the one that you've done in previous chapter ** when you click "go ...
API Exercise
Instruction In this exercise we would create web application to provide information about Food Dish by using MealDB API. By this page we have receive only 1 input with 1 button. Input: Dish name Button: Search A web application should provide user fol...
HTTP & HTTP request
HTTP (Hypertext Transfer Protocol) HTTP is a protocol for fetching resources such as HTML documents. It is the foundation of any data exchange on the Web, and it is a client-server protocol. In HTTP there are four methods that are commonly used in a REST-base...