<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Christopher Powroznik</title>
    <description>The latest articles on DEV Community by Christopher Powroznik (@metroxe).</description>
    <link>https://dev.to/metroxe</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F146593%2Fb53ad384-9cdc-4681-bc03-35e2770b7e3d.jpeg</url>
      <title>DEV Community: Christopher Powroznik</title>
      <link>https://dev.to/metroxe</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/metroxe"/>
    <language>en</language>
    <item>
      <title>One HTML Page Challenge</title>
      <dc:creator>Christopher Powroznik</dc:creator>
      <pubDate>Tue, 19 Nov 2019 21:54:46 +0000</pubDate>
      <link>https://dev.to/metroxe/one-html-page-challenge-3o1d</link>
      <guid>https://dev.to/metroxe/one-html-page-challenge-3o1d</guid>
      <description>&lt;p&gt;&lt;a href="https://onehtmlpagechallenge.com/"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tbkzEK0Y--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://github.com/Metroxe/one-html-page-challenge/raw/master/meta/one-html-page-logo.png%3Fraw%3Dtrue" alt="One HTML Page Challenge" title="One HTML Page Challenge"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The goal is to create anything you want within 1 single html file. Practice your skills with no assistance from libraries, no separation of files, and no assistance of a modern framework. &lt;strong&gt;How creative can you be with such restrictions?&lt;/strong&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://onehtmlpagechallenge.com"&gt;View Submissions&lt;/a&gt;
&lt;/h3&gt;

&lt;h2&gt;
  
  
  Rules
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;You must write all of your code in 1 single HTML file.&lt;/li&gt;
&lt;li&gt;Your file must be less than 1mb (measured by the file size on github).&lt;/li&gt;
&lt;li&gt;You cannot import any external files (this will be checked by looking at the network tab in chrome).&lt;/li&gt;
&lt;li&gt;You are allowed to use libraries, however the library must be hard coded into a script tag and still must fit under the 1MB file size. (I suggest using a cdn and replacing with hardcoding the minified library at the end, or use &lt;a href="https://jscompress.com/"&gt;JSCompress&lt;/a&gt;).&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How to Submit
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Fork the repository.&lt;/li&gt;
&lt;li&gt;Add your html file to the &lt;code&gt;/entries&lt;/code&gt; directory.&lt;/li&gt;
&lt;li&gt;Edit the &lt;code&gt;entries.js&lt;/code&gt; file in the root, with your information for the entry.&lt;/li&gt;
&lt;li&gt;Commit to your forked repo.&lt;/li&gt;
&lt;li&gt;Make a pull request to master from your forked repo.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;em&gt;* You may submit as many entries as you'd like.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;## Publicity&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://boingboing.net/2019/08/23/the-one-html-page-challenge.html"&gt;&lt;strong&gt;Boing Boing&lt;/strong&gt; - The "One HTML Page Challenge", a great example of view-source culture&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://medium.com/@metroxe/one-html-page-challenge-d0e6e6d23e16"&gt;&lt;strong&gt;Medium&lt;/strong&gt; - How Having No-Internet Lead Me to Building a Worldwide Viral Website.&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.10bestdesign.com/blog/coders-try-a-single-page-html-coding-challenge-to-boost-skills/"&gt;&lt;strong&gt;10BestDesign&lt;/strong&gt; - Coders Try a Single-page HTML Coding Challenge to Boost Skills&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;## Useful Links&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://css-tricks.com/fun-times-css-pixel-art/"&gt;Fun Times with CSS Pixel Art&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.pixelartcss.com/"&gt;Pixel Art to CSS&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.lostdecadegames.com/how-to-make-a-simple-html5-canvas-game/"&gt;How to make a simple HTML5 Canvas Game&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://jscompress.com/"&gt;JSCompress: Compile Multiple JS Files Into a Single Script Tag&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://orteil.dashnet.org/cookieclicker/"&gt;Cookie Clicker&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/collections/javascript-game-engines"&gt;List of Javascript Game Frameworks&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://stackoverflow.com/a/41057998"&gt;How to render images in HTML with base64 strings&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.browserling.com/tools/image-to-base64"&gt;Convert images to base64&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>html</category>
      <category>codingchallenge</category>
      <category>javascript</category>
      <category>oldschool</category>
    </item>
    <item>
      <title>React Border Wrapper</title>
      <dc:creator>Christopher Powroznik</dc:creator>
      <pubDate>Mon, 18 Mar 2019 01:37:48 +0000</pubDate>
      <link>https://dev.to/metroxe/react-border-wrapper-461g</link>
      <guid>https://dev.to/metroxe/react-border-wrapper-461g</guid>
      <description>&lt;p&gt;&lt;a href="https://github.com/Metroxe/react-border-wrapper" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmetroxe.github.io%2Freact-border-wrapper%2Freact_border_wrapper_logo.png" alt="React Border Wrapper Logo"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;React Border Wrapper is a new component library that allows the embedding of react elements within the borders of a div. There is a playground that allows editing each of the props and creating a design that works best for your website. Check it out and leave a star on the repo!&lt;/p&gt;

&lt;p&gt;Repo: &lt;a href="https://github.com/Metroxe/react-border-wrapper" rel="noopener noreferrer"&gt;https://github.com/Metroxe/react-border-wrapper&lt;/a&gt;&lt;br&gt;
Playground: &lt;a href="https://metroxe.github.io/react-border-wrapper/" rel="noopener noreferrer"&gt;https://metroxe.github.io/react-border-wrapper/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/Metroxe/react-border-wrapper" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmetroxe.github.io%2Freact-border-wrapper%2Freact_border_wrapper_example.png" alt="React Border Wrapper Example"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>border</category>
      <category>wrapper</category>
      <category>javascript</category>
    </item>
  </channel>
</rss>
