CodemySite_Web development

  E arly bird just learned the react tutorial from Dev Ed. I love his course, he always slowly explains the knowledge step by step(sometimes feeling overwhelmed by others’ tutorials with many knowledge points). Here is his  youtube tutorial . But I still gonna record what I learned here. Step1: building a react project with npx (nodejs environment) npx create-react-app my-app For the motion, use the  framer React library  here. npm install framer-motion Step2: fetch the movies data from   TMDB . Sign up for the account to get the API key and finding at  https://www.themoviedb.org/settings/api  . App.js fetch API data “movies ”  is an array with results inside. When loading the page, show all the popular movies. App.js import We need  two components :  Movie.js  and  Filter.js Move.js Every movie card contains a title and an image. the  image URL  is  https://image.tmdb.org/t/p/w500/kqjL17yufvn9OVLyXYpvtyrFfak.jpg...

  Browser London On my way to step into a senior web developer, I find out the most important thing is thinking like a pro, which means optimization and proficiency are the priority not only the coding processing. I’ve gotten interested in the Progressive Web App which is created in 2015 by Google. And the idea of a PWA is invented by Steve Jobs in 2007. cleverTap When talking about App, you may relate the apps in Apple or Android app store. This is kind of in the middle between the web and a real full-size App. What are the good parts of PWA? Progressive:  A PWA works in most modern web browsers with the power of progressive enhancement principles. Connectivity Independent:  It can run offline, even in the absence of a stable internet connection it works smoothly due to service workers. App-like Experience:  Though they are not real apps they offer the same level of user experience as native mobile apps with app-like navigation and interactions. Responsive:  PW...

  Photo by  Fahim Muntashir  on  Unsplash As a front-end developer, you have to grasp the knowledge about how to fetch the API. But there is a question coming, where the API comes from? Why I can fetch data with a simple URL link and a private API key for some of them. Occasionally, I found a video about it. The curiosity leads me to find out further. Here is the  link . I am gonna record what I learned. F irst, you have to make an app with node.js. Make sure Node.js is installed on the PC. In the project,  npm install express request request-promise nodemon In the package.json file, change the scripts for running. so, you can run the terminal with  npm run dev  or  yarn dev  to run the live server. In the  index.js  file, we begin to build the code. require express and request. the port default is 5000 the home page is the sentence: Welcome to... When the port is 5000, the app listens and runs. For doing a  ScraperAPI , I...