The Smithy – Page 22 – Personal dump site for web development and other stuff

</p> </div> </div> </div> </article> <article id="post-1974" class="post-1974 post type-post status-publish format-standard hentry category-web-development-2 tag-favicon tag-tools"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/favicon-generator/" title="Favicon Generator" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/favicon-generator/" rel="bookmark">Favicon Generator</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/favicon-generator/" rel="bookmark"><time class="entry-date published" datetime="2017-02-07T11:25:58+01:00">February 7, 2017</time><time class="updated" datetime="2017-02-07T11:25:58+01:00">February 7, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <blockquote><p>Convert PNG to ICO, JPG to ICO, GIF to ICO. Create favicon.ico and iOS / Android App Icons. Edit a favicon to fit your needs, or search our gallery.</p></blockquote> <blockquote><p><a href="http://www.favicon-generator.org/">http://www.favicon-generator.org/</a></p></blockquote> </div> </div> </div> </article> <article id="post-1971" class="post-1971 post type-post status-publish format-standard hentry category-web-development-2 tag-sublime-text"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/profiling-sublime-3/" title="Profiling Sublime 3" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/profiling-sublime-3/" rel="bookmark">Profiling Sublime 3</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/profiling-sublime-3/" rel="bookmark"><time class="entry-date published" datetime="2017-02-01T13:27:18+01:00">February 1, 2017</time><time class="updated" datetime="2017-02-01T13:27:34+01:00">February 1, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <p><a href="https://forum.sublimetext.com/t/how-to-determine-if-sublime-is-slow-vs-plugins/25618">source</a></p> <p>You can select <code>Tools > Developer > Profile Plugins</code> to get a profile report showing how much time plugins are taking to respond to events.</p> <p>There is no “safe mode”, but you can simulate it by adding all of your user installed plugins to the <code>ignored_packages</code> setting in your user preferences. If you only (or even mostly only) have packages installed via Package Control, you can use <code>Preferences > Package Settings > Package Control > Settings - User</code> to open the Package Control settings file and copy the contents of <code>installed_packages</code>to disable them all.</p> <p>Additionally if you’re using Windows you can test with the portable version; that version ignores the settings in your user profile, which is a fast way to get at “baseline” reading.</p> <p> <a href="https://hesmid.nl/test/profiling-sublime-3/#more-1971" class="more-link">Read More</a></p> </div> </div> </div> </article> <article id="post-1961" class="post-1961 post type-post status-publish format-standard hentry category-music tag-guitar tag-radiohead"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/radiohead-karma-police-youtube/" title="Radiohead – Karma Police – YouTube" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/radiohead-karma-police-youtube/" rel="bookmark">Radiohead – Karma Police – YouTube</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/radiohead-karma-police-youtube/" rel="bookmark"><time class="entry-date published" datetime="2017-01-28T16:40:30+01:00">January 28, 2017</time><time class="updated" datetime="2017-01-28T16:40:30+01:00">January 28, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <p><a href="https://www.youtube.com/watch?v=IBH97ma9YiI&feature=youtu.be">https://www.youtube.com/watch?v=IBH97ma9YiI&feature=youtu.be</a></p> </div> </div> </div> </article> <article id="post-1944" class="post-1944 post type-post status-publish format-standard hentry category-wordpress-web-development-2 tag-git tag-gulp tag-roots101 tag-sage tag-sass tag-server"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/sage-installation-update-for-version-9/" title="Sage Installation – Update for version 9" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/sage-installation-update-for-version-9/" rel="bookmark">Sage Installation – Update for version 9</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/sage-installation-update-for-version-9/" rel="bookmark"><time class="entry-date published" datetime="2017-01-26T22:24:56+01:00">January 26, 2017</time><time class="updated" datetime="2019-07-13T18:54:18+02:00">July 13, 2019</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <p></p> <ul> <li><span style="color: #ff0000;">Update: 4-12-2018</span></li> </ul> <p>For older versions of Sage see <a href="https://hesmid.nl/test/web-development-2/wordpress-web-development-2/sage-installation/">this</a> post</p> <p><a href="https://github.com/roots/sage">https://github.com/roots/sage</a></p> <p><a href="https://roots.io/sage/docs">https://roots.io/sage/docs</a></p> <h3>Changes in Sage 9</h3> <ul> <li><strong>Laravel’s Blade as a templating engine.</strong><br />Learn about <a href="https://laravel.com/docs/5.3/blade" target="_blank" rel="noopener">Blade</a>. Check out the <a href="https://github.com/roots/sage/tree/master/templates">templates directory</a>. <p>You can opt-out of Blade templates by replacing them with regular PHP ones (you could copy over the templates from Sage 8 if you really wanted to).</p> </li> <li><strong>Replaced gulp and Bower with <a href="https://webpack.js.org/">Webpack</a> and npm.<br /></strong>Bower is dead and all packages should be available on npm. <p>Webpack is responsible for:</p> <ul> <li>Compiling assets <ul> <li>Sass to css with <a href="http://cssnano.co/">ccsnano</a></li> <li>ES6 to JavaScript that can be run in today’s browsers with <a href="https://gitlab.com/Rich-Harris/buble">buble</a></li> </ul> </li> <li>Optimizing images with optipng, gifsicle, pngquant, and svgo</li> </ul> </li> <li><strong>ES6 for Javascript<br /></strong>Great resource for learning about ES6: Wes Bos’ <a href="https://roots.io/r/es6">ES6 for Everyone</a><br />Convert existing JS to ES6 with <a href="https://lebab.io/">Lebab</a></li> <li><strong>Bootstrap 4<br /></strong>It’s still in <a href="http://blog.getbootstrap.com/2017/01/06/bootstrap-4-alpha-6/">alpha</a>, but there’s <em>so</em> many improvements over Bootstrap 3.<strong><br /></strong></li> <li><strong>PSR-2 coding standards.</strong><br />Roots projects switched to <a href="http://www.php-fig.org/psr/psr-2/">PSR-2</a> last year. Previously we had used a modified PSR-2 ruleset, but we stopped caring about 2-spaces in our PHP files and fully adopted PSR-2.</li> <li><strong>Restructured theme files.</strong><br />All theme templates are finally out of the theme root! Our implementation is a little hacky because a <a href="https://core.trac.wordpress.org/ticket/13239">7 year old WordPress Trac ticket</a> still hasn’t landed, but we believe our implementation is the best we can do at this time.</li> <li><strong>Introduced Yarn.</strong><br />Yarn is a drop in npm client replacement. With Yarn, the installation of Node dependencies is quicker & the <code>node_modules</code> directory is smaller.</li> </ul> <h3>Theme Installation</h3> <ol> <li>Make sure all dependencies have been installed before moving on:<br /><a href="http://php.net/manual/en/install.php">PHP</a> >= <del>5.6.4</del> 7.1.3 (with php-mbstring enabled)<br />– Add the wamp php (at least 7.1.3) to Windows PATH (and no other php in the path).<br />– make sure extension=php_mbstring.dll is enabled in the php.ini of the php version you are using (default= enabled)<br /><a href="https://getcomposer.org/download/">Composer</a> (Dependency manager)<br /><a href="http://nodejs.org/">Node.js</a> >= 6.9.x<br />– If necessary install Node (with npm). I used the Windows installer <a href="http://nodejs.org/download/">here</a> (x64 version)<br /><a href="https://yarnpkg.com/en/docs/install">Yarn</a></li> <li>From your WordPress themes directory, run the following composer command: <pre>composer create-project roots/sage your-theme-name dev-master</pre> <p>During theme installation you will have the options to:</p> <p>– Update theme headers (theme name, description, author, etc.)<br />– Select a CSS framework (Bootstrap, Foundation, none)<br />– Add Font Awesome</p> <p><strong>Update: </strong>Newest version of Sage9 (9.0.5 at the time of writing) gives the following error: </p> <p><code>TTY mode is not supported on Windows platform</code></p> <p>Solution: run this from the <em>theme</em> directory</p> <pre><code>./vendor/bin/sage meta # or edit style.css directly ./vendor/bin/sage config # or edit resources/assets/config.json ./vendor/bin/sage preset # Install css framework<br /></code></pre> </li> <li>Navigate to the theme directory then run yarn, and yarn build (to refresh files): <p><code>yarn && yarn build</code></p> <p>You now have all the necessary dependencies to run the build process.</p> <p><strong>About dependencies:</strong><br />If you open<code> package.json</code> you’ll see both <code>devDependencies</code> and <code>dependencies</code> that Sage uses. <code>devDependencies </code>are used by the build process, whereas <code>dependencies</code> are packages that are used in the front-end theme assets.</p> <p><code>dependencies</code> includes the front-end options you selected during install, such as Bootstrap and Font Awesome</p> <p><code>"dependencies": {</code><br /><code>  "bootstrap": "^4.0.0-beta",</code><br /><code>  "font-awesome": "~4.7",</code><br /><code>  "jquery": "1.12.4 - 3",</code><br /><code>  "popper.js": "~1.11"</code><br /><code>}</code></p> <p></p> </li> </ol> <p><strong>————————–</strong></p> <h3>Install WordPress and activate plugins</h3> <p>Optionally import test data with WP Test. See here</p> <h3><strong>Warning when activating i-themes Security:</strong></h3> <p>When activiating this plugin, it will write to your wp-config.php. <br />This causes an error with the Bedrock config setup and make you website/admin unaccesible. <br />Solution: <br />– activate i-themes<br />– edit wp-config.php -> remove file permissions added by i-themes (we use config/application.php for that)<br />– WP admin should be accesible again<br />– Go to i-themes settings-> WordPress Tweaks -> File Editor -> uncheck the box</p> <p> <a href="https://hesmid.nl/test/sage-installation-update-for-version-9/#more-1944" class="more-link">Read More</a></p> </div> </div> </div> </article> <article id="post-1948" class="post-1948 post type-post status-publish format-standard hentry category-articles-and-links tag-build-tools tag-deployment tag-server"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/build-steps-and-deployment-austin-pray/" title="Build Steps and Deployment (Austin Pray)" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/build-steps-and-deployment-austin-pray/" rel="bookmark">Build Steps and Deployment (Austin Pray)</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/build-steps-and-deployment-austin-pray/" rel="bookmark"><time class="entry-date published" datetime="2017-01-26T22:00:37+01:00">January 26, 2017</time><time class="updated" datetime="2017-01-26T22:02:27+01:00">January 26, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <blockquote><p><em>Based on the discussion over here: <a href="https://github.com/roots/roots/pull/1257#issuecomment-70195437">roots/roots/pull/1257</a>.</em></p> <p>These days your web project probably has a build step. Your build step takes your styles, scripts, and other assets and packages them for the browser. Maybe you are using <a href="http://gulpjs.com/">gulp</a>, <a href="http://gruntjs.com/">grunt</a>, or even <a href="https://www.gnu.org/software/make/">make</a> to orchestrate all your compilation steps. This post covers a couple methods for deploying projects with compiled assets and each method’s respective gotchas.</p></blockquote> <p style="padding-left: 30px;">Source: <em><a href="http://austinpray.com/ops/2015/01/15/build-steps-and-deployment.html">Build Steps and Deployment</a></em></p> </div> </div> </div> </article> <article id="post-1946" class="post-1946 post type-post status-publish format-standard hentry category-articles-and-links tag-material-design"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/material-design-lite/" title="Material Design Lite" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/material-design-lite/" rel="bookmark">Material Design Lite</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/material-design-lite/" rel="bookmark"><time class="entry-date published" datetime="2017-01-26T18:36:15+01:00">January 26, 2017</time><time class="updated" datetime="2017-01-26T18:36:15+01:00">January 26, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <blockquote><p>A front-end template that helps you build fast, modern mobile web apps.</p></blockquote> <p>Source: <em><a href="http://www.example.com/">Material Design Lite</a></em></p> </div> </div> </div> </article> <article id="post-1923" class="post-1923 post type-post status-publish format-standard hentry category-books"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/goodreads-listopia/" title="Goodreads – listopia" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/goodreads-listopia/" rel="bookmark">Goodreads – listopia</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/goodreads-listopia/" rel="bookmark"><time class="entry-date published" datetime="2017-01-14T21:45:44+01:00">January 14, 2017</time><time class="updated" datetime="2017-01-14T21:45:56+01:00">January 14, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <p>‘Best of’ book lists</p> <p>Source: <em><a href="https://www.goodreads.com/list">listopia</a></em></p> </div> </div> </div> </article> <article id="post-1921" class="post-1921 post type-post status-publish format-standard hentry category-music tag-african tag-guitar tag-mali"> <div class="blog-item-wrap"> <a href="https://hesmid.nl/test/titati-youtube/" title="Titati – YouTube" > </a> <div class="post-inner-content"> <header class="entry-header page-header"> <h2 class="entry-title"><a href="https://hesmid.nl/test/titati-youtube/" rel="bookmark">Titati – YouTube</a></h2> <div class="entry-meta"> <span class="posted-on"><i class="fa fa-calendar-alt"></i> <a href="https://hesmid.nl/test/titati-youtube/" rel="bookmark"><time class="entry-date published" datetime="2017-01-14T14:58:56+01:00">January 14, 2017</time><time class="updated" datetime="2017-01-14T14:58:56+01:00">January 14, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://hesmid.nl/test/author/smithy/">TheSmithy</a></span></span> </div> </header> <div class="entry-content"> <p><iframe title="Titati" width="648" height="486" src="https://www.youtube.com/embed/oWEcu6ez0HM?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen>

Music from the Meditarranean and Black Sea

From OSX to Ubuntu | Code | Nicolas Perriault