Openverse is a search engine for openly-licensed media.
The OpenverseOpenverseOpenverse is a search engine for openly-licensed media, including photos, audio, and video. Openverse is also the name for the collection of related code repositories that make up the project. find Openverse at https://openverse.org. team builds the Openverse Catalog, APIAPIAn API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways., and front-end application, as well as integrations between Openverse and WordPress. Follow this site for updates and discussions on the project.
You can also come chat with us in #Openverse on SlackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/.. We have a weekly developer chat at 15:00 UTC on Tuesdays.
This repository is the frontend UIUIUI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. for accessing and exploring the openly-licensed content provided by the Openverse API.
This document will give you a high level overview of the modules and components of the application and how they work together.
The OpenverseOpenverseOpenverse is a search engine for openly-licensed media, including photos, audio, and video. Openverse is also the name for the collection of related code repositories that make up the project. find Openverse at https://openverse.org. frontend is built using Vue.js as its main view library.
It uses Nuxt.js as a metaMetaMeta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. framework to handle several key functions:
Server Side rendering in production
Lifecycle methods for data fetching on client and server-side page loads
Building the application for production
If something in the codebase confuses you, it may be a feature of Nuxt.js, so make sure you check out their documentation.
Nuxt.js is built on top of standard libraries in the Vue.js ecosystem. It uses Vue-Router as its routing library and Vuex as state-management library.
Jest is used for unit tests. Playwright is used for end-to-end (e2e) tests, to simulate the user experience and make sure all of our unit-tested components are working in harmony.
The root of the repository contains several configuration files for code formatting, and configuration, for Prettier, Nuxt, Docker, ESLint, and other config files.
environment variables are set in the export const env = {} object. Variables are set with camel case names like this process.env.varNameGoesHere and their default values are formatted in the more conventional process.env.VAR_NAME_GOES_HERE format.
Default HTMLHTMLHTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. metadata and Nuxt plugins are added.
/src All JavaScriptJavaScriptJavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. code lives in the src directory.
Internationalization (usually abbreviated as i18n) of the site is handled by Nuxt i18n module which is integrated with the Vue-i18npluginPluginA plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.
To ensure best experience for international users, make sure to take the following steps when adding new content:
For new text content, add the translation strings to the English locale file , specifying an appropriate key. All keys should be unique. To use this text, add {{ $t('') }} inside the template or this.$i18n('') in JavaScript.