pChart es una clase PHP que nos ayuda a crear gráficas. Los datos que se muestran se recuperan de sentencias SQL, ficheros CSV o simplemente introduciéndolos de forma manual.
Permite realizar gráficas de líneas, barras y circulares. Su uso es bastante sencillo. Incluso permite añadir ficheros de esquemas de colores. pChart
En Developer.com han realizado un tutorial que explica cómo desarrollar tu primera aplicación para Android (ejecutado en un intérprete PHP de tu móvil)…
Como se puede ver, existen dos scripts dentro de npm: build que compila el js y extrae los CSS, y dev, que arranca el servidor de webpack habilitando HMR (🎶 ¡ya no puedo vivir sin él! 🎶).
Ambas configuraciones de webpack usan un script en común (webpack.config.common.js):
const webpack = require( 'webpack' );
const path = require( 'path' );
// Carga los ficheros .vueconst VueLoaderPlugin = require( 'vue-loader/lib/plugin' );
// Configura stylelintconst StyleLintPlugin = require( 'stylelint-webpack-plugin' );
// Para obtener un path para los aliasfunctionresolve( dir ) {
return path.join( __dirname, '.', dir );
}
module.exports = {
mode: 'production',
// Fichero inicial del proyecto
entry: './js/main.js',
// Fichero final para incluir
output: {
filename: 'js/main.js',
publicPath: '/dist/',
},
module: {
// Reglas para los ficheros
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.vue$/,
loader: 'vue-loader',
},
{
test: /\.css$/,
use: [
'css-loader',
'sass-loader',
],
},
],
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new VueLoaderPlugin(),
new StyleLintPlugin( {
files: [ '**/*.{vue,htm,html,css,sss,less,scss,sass}' ],
} ),
],
resolve: {
extensions: [ '.js', '.vue', '.json' ],
alias: {
'@': resolve( '' ),
},
},
};
El frontend se gestiona desde el fichero main.js, que inicializará Vue y añadirá el componente principal:
import Vue from 'vue';
import Buefy from 'buefy';
import'buefy/dist/buefy.css';
import App from './components/App.vue';
import'@/assets/scss/main.scss';
Vue.use( Buefy );
new Vue( {
el: '#app',
components: {
App,
},
render: ( c ) => c( 'app' ),
} );
// accept replacement modulesif ( module.hot ) {
module.hot.accept();
}
Y ya por último el componente App.vue, que muestra simplemente un poco de HTML
Preguntas y respuestas para profesionales de la informática y el diseño gráfico como por ejemplo cómo aprender php, cómo hacer tal efecto en photoshop…
Algunas veces nos podemos encontrar con la necesidad de incluir un motor de búsquedas en nuestra aplicación web, no me refiero a uno interno, sino a uno que busque dentro de todo Internet.
Normalmente se soluciona mediante un formulario que llama a la página de Google, pero eso puede ser un tanto “feo” y no ser exáctamente lo que buscamos.
Si lo que quieres es un script que llame al API de Google para poder recibir las resultados de una búsqueda a Google y luego mostrarla, verás como se hace en la traducción que hacemos del siguiente artÃculo.