![]() ![]() So it's gonna go and fetch data in this form. So this API provides us these support of these many languages.Īnd how are we going to use this API, we're gonna provide a language code to this API and a particular word. Thank you so much, the developer for this API. This is an official Google dictionary API created by this guy, me developer. So the API that we're going to use is called Google dictionary API. Let me just show you the API that we're going to use for this app. Now what it's going to do, it's going to go to the NPM repository, it's going to take all of the files needed to create our create react app, I'm going to bring them over into this word hunt folder. Let me correct this NPM to NP x and press Enter. Yeah, so we need to go to our terminal and type and PX create react app.Īnd we're gonna name this, we're gonna name this app word, hunt, oops, I made a mistake. I mean, let me close these files real quick. I'm gonna go over here and select this particular folder. So what we're going to do is we're going to open a new project real quick, let me select my folder. So without any further ado, let's get started. ![]() Recently, I've uploaded a full fledged myrn stack project tutorial with Redux on my channel, link will be in the description below. That's why I've chosen material UI because it's so easy to implement this dark mode and light mode feature in material UI.Īlso, if you're interested in more tutorials on react js, be sure to check out my channel, which is called roadside coder. ![]() Now what's better in this app is you see in this little corner over here, Tara, light mode and dark mode, he has that amazing feature of this app, you can implement it by using material UI as well as swamp. Now you can see it provides the definition, example and the synonym for that particular word.Īnd not only one definition, it provides all the definition of that particular word.Īnd what's even better is this pronounciation audio, you can play this plane, it tells you the pronunciation of that particular word.Īnd I guess just pronunciation is supported in English only.Īnd I'm going to search my name, which is bu ish.Īnd here you go, you have the meaning of this particular name. So this dictionary has support of over 12 languages. In the first one, we are going to build and deploy this app on netlify.Īnd in the second section, we will convert it into a pw a or progressive web app, so that you can install this app as a native Android or iOS app into your phone. Hey, everyone, welcome back to Free Code Camp.Īnd today we are going to build an awesome dictionary app using react js and material UI. In this course from roadside coder, the dictionary uses material UI and supports 12 languages. Improve Your react skills by learning to build a dictionary app. Watch the full course below or on the YouTube channel (2-hour watch). Here are the topics covered in this course: He has created many popular courses on his YouTube channel. The app also allows users to switch between light and dark theme. You will learn to create a dictionary that has support of over 12 languages. We just published a course on the YouTube channel that will teach you how to create a dictionary app with React and Material UI. And you can improve your skills by building a dictionary project. React continues to be a popular front-end JavaScript library. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |