Inspiration

The main inspiration that I can highlight is that I want to help other developers and fans of the world of computer science to design, analyze and show the web pages that are possible to create with the technology that is available. I chose the theme of Corn and Wheat because they are two foods that are consumed worldwide. So while you know a little information about these foods you also learn to create a web page.

What it does

Every website must have a theme, which will be based on the information it presents to users. What the website that was created does is show two videos that are in Spanish format. These videos are embedded by means of code that is generated by YouTube. A section was created that shows reference images about Corn and Wheat. At the same time, relevant information about both is provided. At the bottom of the page, web links were placed as hyperlinks to the main agencies to read more information about the food programs. The theme of the site is based on these two foods and therefore information related to them is presented.

How I built it

Install Gitbash to move through the console.

The Visual Code IDE was used for the programming code.

Nodejs and Yarn were installed locally first.

Then through Gitbash, the version of Docusaurus v1.14.6 was downloaded to proceed to install it locally.

Later, the file named "sideConfig.js" began to be modified to establish the global parameters of the site. Then the "index.js" that allows the visualization of all the information of the site began to be designed. In the index.js file, the information related to the topic was entered, accompanied by the images.

Later, the "footer.js" file began to be designed in which links were added as hyperlinks. In addition to adding a banner.

Finally, compile all the files and host them in a repository on github.

Challenges I ran into

Docusaurus uses the Markdown language, so sometimes the programming syntax confuses me as I am used to other types of programming languages that I use in my work. Sometimes I needed to declare some type of structure for it to be used by a method that invoked it.

Accomplishments that I'm proud of

I am happy because I managed to design a dynamic and fast site with a programming language that allows flexibility for the creation of web pages. There are many similarities to HTML and CSS because you can have a great variety and styles. And finally, I can say that I have created a tutorial for beginners and fans in the field of web pages and computer science. Which is available in my repository on Github.

What I learned

In Mardown language it is very flexible to create dynamic websites. The structure of Docusaurus is easy to understand and follow. The use of HTML and CSS directives can be shared globally on any website. The Markdown language syntax is designed so that the source code is very easy to understand.

What's next for El Maíz y El Trigo

Add an image gallery, integrate the website with a Facebook page, provide more styles to the page using new CSS formats, add more banners, images and general information to feed the site more, create new sections such as categories or submenus to navigate by the website.

I would look for a way to make a Response Design template because sometimes when you want to see the website on some smart phones, the images are not displayed. But this does not always happen since in other tests that were carried out on smartphones, the images can be seen.

Built With

Share this project:

Updates