Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
This is a solution to the Advice generator app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
This is a simple advice generator app using the Advice Slip API and get it looking as close to the design as possible.
Users should be able to: 1.View the optimal layout for the app depending on their device's screen size 2.See hover states for all interactive elements on the page 3.Generate a new piece of advice by clicking the dice icon
- Solve this URL: Question
- Live Site URL: Add live site URL here
I First Added the html component. The Css was made using the design guide provided by front-end mentor. The Js is the api call so the advice changes every time the green dice is clicked or the page is refreshed. As this is my first project.. i will soon improvise this method with better practices. The version 2.0 of this same project will be provided in react as well.
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
I learnt how to write a good documentation so that its easy. I also maintained the flow and made the code in small steps which gave me confidence and made the learning fun at the same time. Every code is a small or big version of ---> Input -->[process]------>Output. Thats how we should think...first make the html and css. then work on js part . then the improvisations. To see how you can add code snippets, see below:
<h1>code I'm proud of</h1>const proudOfThisFunc = () => {
console.log('🎉')
}- Linkedin-Isha Patel
- Twitter - Click to connect