<?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: moogoo</title>
    <description>The latest articles on DEV Community by moogoo (@moogoo78).</description>
    <link>https://dev.to/moogoo78</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%2F157101%2F9af40549-bb0b-485b-9927-4c630625e203.jpeg</url>
      <title>DEV Community: moogoo</title>
      <link>https://dev.to/moogoo78</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/moogoo78"/>
    <language>en</language>
    <item>
      <title>Check Python Memory Usage</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Mon, 30 Jan 2023 08:52:33 +0000</pubDate>
      <link>https://dev.to/moogoo78/check-python-memory-usage-4kbn</link>
      <guid>https://dev.to/moogoo78/check-python-memory-usage-4kbn</guid>
      <description>&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.geeksforgeeks.org/monitoring-memory-usage-of-a-running-python-program/"&gt;Monitoring memory usage of a running Python program - GeeksforGeeks&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Build-in libraries
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://docs.python.org/3/library/tracemalloc.html"&gt;tracemalloc — Trace memory allocations — Python 3.11.1 documentation&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="nn"&gt;tracemalloc&lt;/span&gt;

&lt;span class="k"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;tracemalloc&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;start&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt;
&lt;span class="c1"&gt;# ...
# my ugly code
# ...
&lt;/span&gt;&lt;span class="k"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;tracemalloc&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;get_traced_memory&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt;

&lt;span class="c1"&gt;# shows (current_usage, peak)
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Tools
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/pythonprofilers/memory_profiler"&gt;pythonprofilers/memory_profiler: Monitor Memory usage of Python code&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/bloomberg/memray"&gt;bloomberg/memray: Memray is a memory profiler for Python&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="c1"&gt;# need pip install memory_profiler
&lt;/span&gt;&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;memory_profiler&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;profile&lt;/span&gt;

&lt;span class="o"&gt;@&lt;/span&gt;&lt;span class="n"&gt;profile&lt;/span&gt;
&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;my_ugly_func&lt;/span&gt;&lt;span class="p"&gt;():&lt;/span&gt;
  &lt;span class="c1"&gt;# ...
&lt;/span&gt;  &lt;span class="c1"&gt;# ...
&lt;/span&gt;
&lt;span class="c1"&gt;# show memory usage line by line
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Other
&lt;/h2&gt;

&lt;p&gt;Tkinter initial use 41.9 MB&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--OC0I0KJX--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jzx54q9nkzvxhhs4yp9x.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--OC0I0KJX--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jzx54q9nkzvxhhs4yp9x.png" alt="Image description" width="877" height="200"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>python</category>
      <category>memory</category>
    </item>
    <item>
      <title>PostgreSQL notes</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Mon, 26 Dec 2022 00:01:46 +0000</pubDate>
      <link>https://dev.to/moogoo78/postgresql-notes-1glh</link>
      <guid>https://dev.to/moogoo78/postgresql-notes-1glh</guid>
      <description>&lt;h2&gt;
  
  
  Quick commands
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# ALTER DATABASE name RENAME TO newname

# mysql: SHOW DATABASES
# pgres: \l
# mysql: SHOW TABLES
# pgres: \d
# mysql: USE mydbname
# pgres: \c  mydbname # \connect

# mysql: SHOW COLUMNS
# pgres: \d table

# mysql: DESCRIBE TABLE
# pgres: \d+ table ( \dt)

# exit: \q

SELECT version();
show data_directory;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  HOW TO
&lt;/h2&gt;

&lt;h3&gt;
  
  
  export/import
&lt;/h3&gt;

&lt;p&gt;dump command&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;pg_dump &lt;span class="nt"&gt;-U&lt;/span&gt; USERNAME DBNAME &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; dbexport.pgsql
&lt;span class="c"&gt;# PGPASSWORD="mypassword" pg_dump -U myusername dbname 密碼 &amp;gt; output.sql&lt;/span&gt;
pg_dump &lt;span class="nt"&gt;-U&lt;/span&gt; postgres &lt;span class="nt"&gt;-f&lt;/span&gt; /tmp/dump.sql.gz &lt;span class="nt"&gt;--compress&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;5 &lt;span class="nt"&gt;--no-owner&lt;/span&gt; dbname
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;import command&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;psql &lt;span class="nt"&gt;-f&lt;/span&gt; backup.sql dbname dbuser
&lt;span class="c"&gt;# import specific table&lt;/span&gt;
pg_dump &lt;span class="nt"&gt;-U&lt;/span&gt; xxx public.TABLE_NAME DATABASE_NAME &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; out.sql
pg_dump &lt;span class="nt"&gt;-U&lt;/span&gt; xxx &lt;span class="nt"&gt;-d&lt;/span&gt; DB_NAME &lt;span class="nt"&gt;-t&lt;/span&gt; TABLE_NAME &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; out.sql
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;export csv&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;psql &lt;span class="nt"&gt;-U&lt;/span&gt; user &lt;span class="nt"&gt;-d&lt;/span&gt; db_name &lt;span class="nt"&gt;-c&lt;/span&gt; &lt;span class="s2"&gt;"Copy (Select * From foo_table LIMIT 10) To STDOUT With CSV HEADER DELIMITER ',';"&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; foo_data.csv
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Slow query log
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# 1. find config file
psql -U postgres -c 'SHOW config_file'

# 2. edit conf
# default
#log_min_duration_statement = -1
log_min_duration_statement = 1000 # (log all queries executing more than 1 second)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h1&gt;
  
  
  possible log paths:
&lt;/h1&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;/var/lib/pgsql/PG_VERSION/data/log/
/var/log/postgresql/
/var/lib/postgresql/PG_VERSION/main/pg_log
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;restart postgres (not “service”)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;su - postgres -c "PGDATA=$PGDATA {path/to/}pg_ctl -w restart"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  create user
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="n"&gt;postgres&lt;/span&gt;&lt;span class="o"&gt;=#&lt;/span&gt; &lt;span class="k"&gt;CREATE&lt;/span&gt; &lt;span class="k"&gt;DATABASE&lt;/span&gt; &lt;span class="n"&gt;mydbname&lt;/span&gt; &lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="n"&gt;postgres&lt;/span&gt;&lt;span class="o"&gt;=#&lt;/span&gt; &lt;span class="k"&gt;CREATE&lt;/span&gt; &lt;span class="k"&gt;DATABASE&lt;/span&gt; &lt;span class="n"&gt;mydbname&lt;/span&gt;  &lt;span class="k"&gt;OWNER&lt;/span&gt; &lt;span class="n"&gt;myusername&lt;/span&gt; &lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="n"&gt;postgres&lt;/span&gt;&lt;span class="o"&gt;=#&lt;/span&gt; &lt;span class="k"&gt;GRANT&lt;/span&gt; &lt;span class="k"&gt;ALL&lt;/span&gt; &lt;span class="k"&gt;PRIVILEGES&lt;/span&gt; &lt;span class="k"&gt;ON&lt;/span&gt; &lt;span class="k"&gt;DATABASE&lt;/span&gt; &lt;span class="n"&gt;mydbname&lt;/span&gt; &lt;span class="k"&gt;to&lt;/span&gt; &lt;span class="n"&gt;myusername&lt;/span&gt; &lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;ALTER&lt;/span&gt; &lt;span class="k"&gt;ROLE&lt;/span&gt; &lt;span class="n"&gt;myusername&lt;/span&gt; &lt;span class="k"&gt;WITH&lt;/span&gt; &lt;span class="n"&gt;superuser&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Problems
&lt;/h2&gt;

&lt;h3&gt;
  
  
  sequences
&lt;/h3&gt;

&lt;p&gt;duplicate key error... (after restore data)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="n"&gt;setval&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s1"&gt;'my_sequence_name'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;SELECT&lt;/span&gt; &lt;span class="k"&gt;max&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;id&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="k"&gt;FROM&lt;/span&gt; &lt;span class="n"&gt;my_table&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="n"&gt;my_sequence_name&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="k"&gt;is&lt;/span&gt; &lt;span class="n"&gt;my_table_id_seq&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;truncate &amp;amp; auto increment&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight sql"&gt;&lt;code&gt;&lt;span class="k"&gt;TRUNCATE&lt;/span&gt; &lt;span class="k"&gt;table_name&lt;/span&gt; &lt;span class="k"&gt;RESTART&lt;/span&gt; &lt;span class="k"&gt;IDENTITY&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>postgres</category>
    </item>
    <item>
      <title>Note abont JavaScript DOM objects</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Tue, 13 Dec 2022 04:25:17 +0000</pubDate>
      <link>https://dev.to/moogoo78/note-abont-javascript-dom-objects-118o</link>
      <guid>https://dev.to/moogoo78/note-abont-javascript-dom-objects-118o</guid>
      <description>&lt;p&gt;DOM Element structure&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;+-------------+    +------+    +---------+    +-------------+
| EventTarget | &amp;lt;- | Node | &amp;lt;- | Element | &amp;lt;- | HTMLElement |
+-------------+    +------+    +---------+    +-------------+
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;The DOM Node interface is an abstract base class upon which many other DOM API objects are based, thus letting those object types to be used similarly and often interchangeably.&lt;/p&gt;

&lt;p&gt;every kind of DOM node is represented by an interface based on Node&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/Element"&gt;Element - Web APIs | MDN&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
    </item>
    <item>
      <title>JavaScript: Live vs. Static NodeLists</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Tue, 13 Dec 2022 04:24:06 +0000</pubDate>
      <link>https://dev.to/moogoo78/javascript-live-vs-static-nodelists-367f</link>
      <guid>https://dev.to/moogoo78/javascript-live-vs-static-nodelists-367f</guid>
      <description>&lt;p&gt;There are two types of &lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/NodeList"&gt;NodeList&lt;/a&gt;: &lt;strong&gt;live and static&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;live NodeList means that changes in the DOM automatically update the collection.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;Node.childNodes is a live NodeList&lt;/li&gt;
&lt;li&gt;document.querySelectorAll() returns static NodeList
&lt;a href="https://developer.mozilla.org/en-US/docs/Web/API/Node"&gt;Node&lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Sample Code: &lt;/p&gt;

&lt;p&gt;HTML&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight html"&gt;&lt;code&gt;&lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;id=&lt;/span&gt;&lt;span class="s"&gt;"parent"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;class=&lt;/span&gt;&lt;span class="s"&gt;"child"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;1&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
  &lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;class=&lt;/span&gt;&lt;span class="s"&gt;"child"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;2&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
  &lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;class=&lt;/span&gt;&lt;span class="s"&gt;"child"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;3&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;JavaScript&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;liveParent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;querySelector&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;#parent&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;staticChildren&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;querySelectorAll&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;.child&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;liveParent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;childNodes&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;staticChildren&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="nx"&gt;liveParent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;appendChild&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;createElement&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;div&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;liveParent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;childNodes&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;staticChildren&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Results:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Wyfm1ruW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6te92t3ov07l6420xom6.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Wyfm1ruW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6te92t3ov07l6420xom6.png" alt="javascript-live-static-node-list-sample" width="853" height="45"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can see that the length of &lt;em&gt;staticChildren&lt;/em&gt; still the same after the parent object append a child.&lt;/p&gt;

</description>
      <category>javascript</category>
    </item>
    <item>
      <title>Tkinter &amp; Tk resources</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Thu, 22 Sep 2022 00:48:37 +0000</pubDate>
      <link>https://dev.to/moogoo78/tkinter-tk-resources-7i4</link>
      <guid>https://dev.to/moogoo78/tkinter-tk-resources-7i4</guid>
      <description>&lt;h2&gt;
  
  
  Documentation
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.tcl.tk/man/tcl8.6/TkCmd/contents.html"&gt;Tk Commands&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://tkdocs.com/index.html"&gt;TkDocs Home&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://anzeljg.github.io/rin2/book2/2405/docs/tkinter/index.html"&gt;Tkinter 8.5 reference: a GUI for Python&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://tk-tutorial.readthedocs.io/en/latest/index.html"&gt;Welcome to this Tk tutorial! — Tk tutorial 2020 documentation&lt;/a&gt;
&lt;a href="https://www.pythontutorial.net/tkinter/tkinter-hello-world/"&gt;Tkinter Hello, World!&lt;/a&gt; many examples/snippets&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Default Widgets
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://docs.python.org/3/library/dialog.html"&gt;Tkinter Dialogs — Python 3.10.7 documentation&lt;/a&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://docs.python.org/3/library/tkinter.messagebox.html"&gt;tkinter.messagebox - Tkinter message prompts - Python 3.10.5 documentation&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Canvas&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;no border&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;highlightthickness=0, relief='ridge', bd=0
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Image&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="n"&gt;foo&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;PhotoImage&lt;/span&gt; &lt;span class="c1"&gt;# foo may clear by garbage collection, can assign to class to prevent
&lt;/span&gt;&lt;span class="n"&gt;button&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;image&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;foo&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Quick references
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Widgets useful methods
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;The following are some of the most useful methods: 

- winfo_class: a class identifying the type of widget, e.g. TButton for a themed button
- winfo_children: a list of widgets that are the direct children of a widget in the hierarchy
- winfo_parent: parent of the widget in the hierarchy
- winfo_toplevel: the toplevel window containing this widget 
- winfo_width, winfo_height: current width and height of the widget; not accurate until appears onscreen 
- winfo_reqwidth, winfo_reqheight: the width and height the widget requests of the geometry manager (more on this shortly) 
- winfo_x, winfo_y: the position of the top-left corner of the widget relative to its parent 
- winfo_rootx, winfo_rooty: the position of the top-left corner of the widget relative to the entire screen the position of the top-left corner of the widget relative to its parent 
- winfo_rootx, winfo_rooty: the position of the top-left corner of the widget relative to the entire screen 
- winfo_vieweable: whether the widget is displayed or hidden (all its ancestors in the hierarchy must be viewable for it to be viewable)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;screen size&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="n"&gt;screen_width&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;win&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_screenwidth&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;span class="n"&gt;screen_height&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;win&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_screenheight&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;span class="c1"&gt;#Print the screen size
&lt;/span&gt;&lt;span class="k"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Screen width:"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;screen_width&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="k"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Screen height:"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;screen_height&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;print_hierarchy&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;depth&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
    &lt;span class="k"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'  '&lt;/span&gt;&lt;span class="o"&gt;*&lt;/span&gt;&lt;span class="n"&gt;depth&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_class&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="s"&gt;' w='&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nb"&gt;str&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_width&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="s"&gt;' h='&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nb"&gt;str&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_height&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="s"&gt;' x='&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nb"&gt;str&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_x&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="s"&gt;' y='&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nb"&gt;str&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_y&lt;/span&gt;&lt;span class="p"&gt;()))&lt;/span&gt;
    &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;i&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_children&lt;/span&gt;&lt;span class="p"&gt;():&lt;/span&gt;
        &lt;span class="n"&gt;print_hierarchy&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;i&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;depth&lt;/span&gt;&lt;span class="o"&gt;+&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;print_hierarchy&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;root&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Grid management
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://anzeljg.github.io/rin2/book2/2405/docs/tkinter/grid-methods.html"&gt;4.2. Other grid management methods&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;grid_forget &amp;amp; grid_remove&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://stackoverflow.com/questions/52875751/is-their-a-grid-remember-reversible-grid-forget/52876176#52876176"&gt;python - Is their a grid_remember()? Reversible grid_forget()? - Stack Overflow&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="n"&gt;grid_slaves&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;grid_remove&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;span class="n"&gt;destroy&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;span class="n"&gt;grid_forget&lt;/span&gt;
&lt;span class="n"&gt;w&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;grid&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;

&lt;span class="c1"&gt;# destroy
&lt;/span&gt;&lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;widget&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="n"&gt;frame&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;winfo_children&lt;/span&gt;&lt;span class="p"&gt;():&lt;/span&gt;
    &lt;span class="n"&gt;widget&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;destroy&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  life circle ?
&lt;/h3&gt;

&lt;p&gt;update(), update_idletastks()&lt;/p&gt;

&lt;p&gt;&lt;a href="https://stackoverflow.com/questions/29158811/whats-the-difference-between-update-and-update-idletasks/29159152#29159152"&gt;python - What's the difference between "update" and "update_idletasks"? - Stack Overflow&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;The important thing to remember is that update blocks until all events are processed. In effect, that means you have a mainloop nested inside a mainloop. It's never a good idea to have an infinite loop inside an infinite loop.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Event
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Modifiers&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Control
Mod1, M1, Command
Alt
Mod2, M2, Option
Shift
Mod3, M3
Lock
Mod4, M4
Extended
Mod5, M5
Button1, B1
Meta, M
Button2, B2
Double
Button3, B3
Triple
Button4, B4
Quadruple
Button5, B5
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Event types&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Activate
Destroy
Map
ButtonPress, Button
Enter
MapRequest
ButtonRelease
Expose
Motion
Circulate
FocusIn
MouseWheel
CirculateRequest
FocusOut
Property
Colormap
Gravity
Reparent
Configure
KeyPress, Key
ResizeRequest
ConfigureRequest
KeyRelease
Unmap
Create
Leave
Visibility
Deactivate
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Some Examples&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;Button-1&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;left_mouse_down&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; 
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;ButtonRelease-1&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;left_mouse_up&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;Button-3&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;right_mouse_down&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;ButtonRelease-3&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;right_mouse_up&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;B1-Motion&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;moving_mouse&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;Enter&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;moving_into&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;Leave&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;moving_out&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;FocusIn&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;focus&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;label&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;FocusOut&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;unfocus&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;Double&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="n"&gt;Button&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;MouseWheel&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;Button&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;Button&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;Control&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="n"&gt;Button&lt;/span&gt;&lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="n"&gt;space&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="c1"&gt;# lower case
&lt;/span&gt;&lt;span class="n"&gt;frame&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;bind&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'&amp;lt;Control-Shift-S&amp;gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;key&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://anzeljg.github.io/rin2/book2/2405/docs/tkinter/binding-levels.html"&gt;54.1. Levels of binding&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;bind &amp;amp; bind_all
bind_all: a certain event calls a handler no matter what widget has the focus or is under the mouse
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;event_generate cannot send args (data)&lt;br&gt;
&lt;a href="https://www.reddit.com/r/Tkinter/comments/m4ux51/generate_event_passing_data/"&gt;Generate Event Passing Data : Tkinter&lt;/a&gt;&lt;/p&gt;
&lt;h3&gt;
  
  
  Styles
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--zdvPYi4A--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://tkdocs.com/shipman/img/relief.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--zdvPYi4A--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://tkdocs.com/shipman/img/relief.png" alt="Refief Styles" width="596" height="55"&gt;&lt;/a&gt;&lt;br&gt;
via: &lt;a href="https://tkdocs.com/shipman/relief.html"&gt;5.6. Relief styles&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="c1"&gt;# Create style Object
&lt;/span&gt;&lt;span class="n"&gt;style&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Style&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;

&lt;span class="n"&gt;style&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;configure&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'TButton'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;font&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt;
               &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'calibri'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;20&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;'bold'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
                    &lt;span class="n"&gt;borderwidth&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s"&gt;'4'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

&lt;span class="c1"&gt;# Changes will be reflected
# by the movement of mouse.
&lt;/span&gt;&lt;span class="n"&gt;style&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nb"&gt;map&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'TButton'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;foreground&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[(&lt;/span&gt;&lt;span class="s"&gt;'active'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;'! disabled'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;'green'&lt;/span&gt;&lt;span class="p"&gt;)],&lt;/span&gt;
                     &lt;span class="n"&gt;background&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[(&lt;/span&gt;&lt;span class="s"&gt;'active'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;'black'&lt;/span&gt;&lt;span class="p"&gt;)])&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Packages/Widgets
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Widgets
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://ttkwidgets.readthedocs.io/en/latest/index.html"&gt;Welcome to ttkwidgets’s documentation! — ttkwidgets 0.12.0 documentation&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://code.activestate.com/recipes/580770-combobox-autocomplete/"&gt;Combobox Autocomplete « Python recipes « ActiveState Code&lt;/a&gt;
-&lt;a href="https://github.com/r2123b/tkinter-ttk-Treeview-Simple-Demo/blob/master/ComplexTreeview.py"&gt;tkinter-ttk-Treeview-Simple-Demo/ComplexTreeview.py at master · r2123b/tkinter-ttk-Treeview-Simple-Demo&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Video Player
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://github.com/huskeee/tkvideo"&gt;huskeee/tkvideo: Python module for playing videos (without sound) inside tkinter Label widget using Pillow and imageio&lt;/a&gt; 用了 &lt;a href="https://github.com/imageio/imageio"&gt;imageio/imageio: Python library for reading and writing image data&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/PaulleDemon/tkVideoPlayer"&gt;PaulleDemon/tkVideoPlayer: Video player for tkinter.&lt;/a&gt; 用 av (ffmpeg4) build 不成功&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Table/Excel/DataGrid
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/ragardner/tksheet"&gt;ragardner/tksheet: Python 3.6+ tkinter table widget for displaying tabular data&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/dmnfarrell/tkintertable"&gt;dmnfarrell/tkintertable: A pure Python library for adding tables to a Tkinter application&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/nbro/tktable"&gt;nbro/tktable: Wrapper library for Python of the homonymous Tk library.&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/jazzband/prettytable"&gt;jazzband/prettytable: Display tabular data in a visually appealing ASCII table format&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Style/Theme
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.wikipython.com/tkinter-ttk-tix/summary-information/colors/"&gt;COLORS – wikiPython&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://wiki.tcl-lang.org/page/List+of+ttk+Themes"&gt;List of ttk Themes&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/PaulleDemon/tkStyleSheet"&gt;PaulleDemon/tkStyleSheet: stylesheet for Tkinter&lt;/a&gt;
&lt;a href="https://www.reddit.com/r/Python/comments/lps11c/how_to_make_tkinter_look_modern_how_to_use_themes/"&gt;How to make Tkinter look modern? - How to use themes in Tkinter : Python&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Books
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.amazon.com/dp/B08KWRQFW1/?tag=n"&gt;Modern Tkinter for Busy Python Developers: Quickly learn to create great looking user interfaces for Windows, Mac and Linux using Python's standard GUI toolkit 3, Roseman, Mark, eBook - Amazon.com&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.oreilly.com/library/view/python-gui-programming/9781788835886/"&gt;Python GUI Programming with Tkinter [Book]&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Interesting
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/learnbyexample/py_regular_expressions/tree/master/interactive_exercises"&gt;py_regular_expressions/interactive_exercises at master · learnbyexample/py_regular_expressions&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>python</category>
      <category>tk</category>
      <category>gui</category>
    </item>
    <item>
      <title>Python queue.Queue</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Sat, 16 Jul 2022 00:59:18 +0000</pubDate>
      <link>https://dev.to/moogoo78/python-queuequeue-4kdd</link>
      <guid>https://dev.to/moogoo78/python-queuequeue-4kdd</guid>
      <description>&lt;p&gt;Python has 3 ways to implement a "queue" (FIFO rule).&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;list&lt;/li&gt;
&lt;li&gt;collections.deque&lt;/li&gt;
&lt;li&gt;queue.Queue&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://docs.python.org/3/tutorial/datastructures.html"&gt;list&lt;/a&gt; is build-in, multi purpose structure. If get item out from a list, need to shift all item, may slow. &lt;a href="https://docs.python.org/3/library/collections.html"&gt;collections&lt;/a&gt;.deque: list-like container with fast appends and pops on either end. Here introduce more about &lt;a href="https://docs.python.org/3/library/queue.html"&gt;Queue&lt;/a&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from queue import Queue

q = Queue(5) # 5 is maxsize of the queue [1]
q.put('foo') # put item into a queue
q.put('bar')

print(q.qsize()) # approximate [2] size of the queue
&amp;gt;&amp;gt;&amp;gt; 2
print(q.full()) # check full or not
&amp;gt;&amp;gt;&amp;gt; False
print(q.empty()) # check empty or not
&amp;gt;&amp;gt;&amp;gt; False
a = q.get()
print(a)
&amp;gt;&amp;gt;&amp;gt; foo
b = q.get()
print(b)
&amp;gt;&amp;gt;&amp;gt; bar
c = q.get() 
# blocking  ... queue is empty, wait until an item is available. 

get_nowait() # get(False), if not available, raise queue.Empty

# blocking process
task_done() &amp;amp; join()
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;[1]&lt;br&gt;
If queue is full, no free slow, put() will block while available&lt;/p&gt;

&lt;p&gt;[2]&lt;br&gt;
qsize() &amp;gt; 0 doesn’t guarantee that a subsequent get() will not block, nor will qsize() &amp;lt; maxsize guarantee that put() will not block.&lt;/p&gt;

</description>
      <category>python</category>
      <category>queue</category>
    </item>
    <item>
      <title>macOS: xcrun: error</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Wed, 13 Jul 2022 02:58:59 +0000</pubDate>
      <link>https://dev.to/moogoo78/macos-xcrun-error-5bnm</link>
      <guid>https://dev.to/moogoo78/macos-xcrun-error-5bnm</guid>
      <description>&lt;p&gt;After upgrade macOS to 12.4 (Monterey), execute &lt;code&gt;make&lt;/code&gt; command will get this error message:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;fixed: udate Xcode toolkit&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ xcode-select --install
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;wait about 20 minutes, my &lt;code&gt;make&lt;/code&gt; command works.&lt;/p&gt;

</description>
      <category>macos</category>
      <category>xcode</category>
    </item>
    <item>
      <title>Rough notes about Google reCAPTCHA (v2 checkbox type)</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Sat, 02 Jul 2022 10:54:34 +0000</pubDate>
      <link>https://dev.to/moogoo78/rough-notes-about-google-recaptcha-v2-checkbox-type-4e0i</link>
      <guid>https://dev.to/moogoo78/rough-notes-about-google-recaptcha-v2-checkbox-type-4e0i</guid>
      <description>&lt;p&gt;According to official &lt;a href="https://developers.google.com/recaptcha/intro"&gt;docs&lt;/a&gt;:&lt;/p&gt;

&lt;p&gt;There are 2 versions and four types of reCAPTCHA: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;reCAPTCHA v3

&lt;ul&gt;
&lt;li&gt;returning a score, giving you the ability to take action in the context of your site: for instance requiring additional factors of authentication, sending a post to moderation, or throttling bots that may be scraping content.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;reCAPTCHA v2 

&lt;ul&gt;
&lt;li&gt;"I'm not a robot" Checkbox&lt;/li&gt;
&lt;li&gt;Invisible reCAPTCHA badge&lt;/li&gt;
&lt;li&gt;Android&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I choose reCAPTCHA v2 Checkbox, seems most site use that type.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;render the widget
Two ways can do that:&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;1) Automatically render&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;html&amp;gt;
  &amp;lt;head&amp;gt;
    &amp;lt;title&amp;gt;reCAPTCHA demo: Simple page&amp;lt;/title&amp;gt;
    &amp;lt;script src="https://www.google.com/recaptcha/api.js" async defer&amp;gt;&amp;lt;/script&amp;gt;
  &amp;lt;/head&amp;gt;
  &amp;lt;body&amp;gt;
    &amp;lt;form action="?" method="POST"&amp;gt;
      &amp;lt;div class="g-recaptcha" data-sitekey="your_site_key"&amp;gt;&amp;lt;/div&amp;gt;
      &amp;lt;br/&amp;gt;
      &amp;lt;input type="submit" value="Submit"&amp;gt;
    &amp;lt;/form&amp;gt;
  &amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;2) Explicitly render&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&amp;amp;render=explicit"
    async defer&amp;gt;
&amp;lt;/script&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://developers.google.com/recaptcha/docs/display"&gt;more attributes&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Server side verifying&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;3 way to get user's response &lt;code&gt;token&lt;/code&gt;&lt;br&gt;
1) g-recaptcha-response POST parameter when the user submits the form on your site&lt;br&gt;
2) grecaptcha.getResponse(opt_widget_id) after the user completes the reCAPTCHA challenge&lt;br&gt;
3) As a string argument to your callback function if data-callback is specified in either the g-recaptcha tag attribute or the callback parameter in the grecaptcha.render method&lt;/p&gt;

&lt;p&gt;API Request&lt;br&gt;
URL: &lt;a href="https://www.google.com/recaptcha/api/siteverify"&gt;https://www.google.com/recaptcha/api/siteverify&lt;/a&gt; METHOD: POST&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;payload: {
  secret: 'MY_SECRET_KEY', // Required. The shared key between your site and reCAPTCHA.
  response: 'token', // Required. The user response token provided by the reCAPTCHA client-side integration on your site.
  remoteip: 'MY_IP', llOptional. The user's IP address.
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;JSON Response&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "success": true|false,
  "challenge_ts": timestamp,  // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
  "hostname": string,         // the hostname of the site where the reCAPTCHA was solved
  "error-codes": [...]        // optional
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>google</category>
      <category>recaptcha</category>
      <category>html</category>
      <category>javascript</category>
    </item>
    <item>
      <title>React Router 6 send data from link to target page</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Tue, 21 Jun 2022 10:57:46 +0000</pubDate>
      <link>https://dev.to/moogoo78/react-router-6-send-data-from-link-to-target-page-3c83</link>
      <guid>https://dev.to/moogoo78/react-router-6-send-data-from-link-to-target-page-3c83</guid>
      <description>&lt;p&gt;use &lt;code&gt;Link&lt;/code&gt;, &lt;code&gt;useLocation&lt;/code&gt; from React-Router 6, send my filterList data from list to detail page.&lt;/p&gt;

&lt;p&gt;After enter filter in list page, click on row and go to detail page, then we can &lt;strong&gt;go back&lt;/strong&gt; to list page with filters we added.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import {
  Link as RouterLink,
} from "react-router-dom";
import { useLocation } from "react-router";
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;List page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;Button
  variant="contained"
  color="primary"
  size="small"
  style={{ marginLeft: 16 }}
  component={RouterLink}
  state={{ filterList: state.filterList }}
  to= {`/collections/${params.row.id}`}
&amp;gt;
  Edit
&amp;lt;/Button&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Detail page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;Button
  variant="outlined"
  startIcon={&amp;lt;KeyboardBackspaceIcon /&amp;gt;}
  to="/collections"
  state={{filterList: location.state.filterList}}
  component={RouterLink}
&amp;gt;
  back to list
&amp;lt;/Button&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>react</category>
      <category>reactrouter</category>
    </item>
    <item>
      <title>AWS command-line</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Tue, 21 Jun 2022 09:35:19 +0000</pubDate>
      <link>https://dev.to/moogoo78/aws-command-line-g6n</link>
      <guid>https://dev.to/moogoo78/aws-command-line-g6n</guid>
      <description>&lt;p&gt;some drafts for aws command...&lt;/p&gt;

&lt;h2&gt;
  
  
  Configure Account
&lt;/h2&gt;

&lt;p&gt;ref: &lt;a href="https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-profiles.html"&gt;Named profiles for the AWS CLI&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;check &lt;code&gt;~/.aws/config&lt;/code&gt; for your profile settings.&lt;/p&gt;

&lt;p&gt;get credentials from AWS console, and add key and secret_key  to &lt;code&gt;~/.aws/credentials&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;change account (profile reference to .aws/config)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ export AWS_PROFILE=my-profile 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  S3
&lt;/h2&gt;

&lt;p&gt;check bucket list from specific account&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ aws s3 ls # not list, only ls
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  dump bucket
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ aws s3 sync s3://my-bucket my-local-dir
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>aws</category>
      <category>s3</category>
    </item>
    <item>
      <title>pbcopy and pbpaste: Mac command-line copy and paste tools</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Mon, 20 Jun 2022 14:55:16 +0000</pubDate>
      <link>https://dev.to/moogoo78/pbcopy-and-pbpaste-mac-command-line-copy-and-paste-tools-1jid</link>
      <guid>https://dev.to/moogoo78/pbcopy-and-pbpaste-mac-command-line-copy-and-paste-tools-1jid</guid>
      <description>&lt;p&gt;&lt;code&gt;phcopy&lt;/code&gt; and &lt;code&gt;pbpaste&lt;/code&gt; are super useful command-line tools for Copy and Paste (ctrl+c / ctrl+v).&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# copy content from a text file
$ cat my-file.txt | pbcopy
# paste (output) from clipboard
$ pbpaste
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>mac</category>
      <category>command</category>
    </item>
    <item>
      <title>Install Docker and docker-compose on AWS EC2 (AMI)</title>
      <dc:creator>moogoo</dc:creator>
      <pubDate>Mon, 20 Jun 2022 05:29:05 +0000</pubDate>
      <link>https://dev.to/moogoo78/install-docker-and-docker-compose-on-aws-ec2-ami-507l</link>
      <guid>https://dev.to/moogoo78/install-docker-and-docker-compose-on-aws-ec2-ami-507l</guid>
      <description>&lt;p&gt;Amazon Linux 2&lt;/p&gt;

&lt;p&gt;Install Docker&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# Update AMI yum packages
$ sudo yum update
# Install Docker by yum
$ sudo yum install docker
# add docker group to ec2-user
$ sudo usermod -a -G docker ec2-user
$ id ec2-user
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Install docker-compose&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ wget https://github.com/docker/compose/releases/latest/download/docker-compose-$(uname -s)-$(uname -m) 
$ sudo mv docker-compose-$(uname -s)-$(uname -m) /usr/local/bin/docker-compose
$ sudo chmod -v +x /usr/local/bin/docker-compose
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Configure docker service&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# start service at boot
$ sudo systemctl enable docker.service
# start service now
$ sudo systemctl start docker.service
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;check service&lt;br&gt;
'&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
